Question

我正在创建一个包含某个字段的表，可以选择添加新行。最后，我将打印所有的字段。我要做的应用是触摸显示器，所以我做了一个新的键盘。问题是如果我按下这个键盘的按钮，我可以读取相应的输入，但我无法在json数组中读取。但是如果我用计算机键盘输入这个输入，我可以看到数组中的按键。

这不是我的应用程序，只是一个向您展示问题的简单示例：http://plnkr.co/edit/4cP2xSDRgvHG29RuA92N?p=preview

这是KeyBoard的jQuery：

    $(document).ready(function() {
  $('#myInput').click(function() {
    $('#n_keypad').fadeToggle('fast');
  });
  $('.done').click(function() {
    $('#n_keypad').hide('fast');
  });
  $('.numero').click(function() {
    if (!isNaN($('#myInput').val())) {
      if (parseInt($('#myInput').val()) === 0) {
        $('#myInput').val($(this).text());
      } else {
        $('#myInput').val($('#myInput').val() + $(this).text());
      }
    }
  });
  $('.neg').click(function() {
    if (!isNaN($('#myInput').val()) && $('#myInput').val().length > 0) {
      if (parseInt($('#myInput').val()) > 0) {
        $('#myInput').val(parseInt($('#myInput').val()) - 1);
      }
    }
  });
  $('.pos').click(function() {
    if (!isNaN($('#myInput').val()) && $('#myInput').val().length > 0) {
      $('#myInput').val(parseInt($('#myInput').val()) + 1);
    }
  });
  $('.del').click(function() {
    $('#myInput').val($('#myInput').val().substring(0, $('#myInput').val().length - 1));
  });
  $('.clear').click(function() {
    $('#myInput').val('');
  });
  $('.zero').click(function() {
    if (!isNaN($('#myInput').val())) {
      if (parseInt($('#myInput').val()) !== 0) {
        $('#myInput').val($('#myInput').val() + $(this).text());
      }
    }
  });
});

谢谢！

Answer 1

使用jQuery的角度。这是一个运行的例子。它更容易和松散耦合。

HTML

<input type="text"  data-ng-model="food.Text" data-ng-click="food.showKeypad = true" />
<keypad data-show="food.showKeypad" data-text="food.Text" />

JS

app.directive('keypad', function($compile) {
      return {
          restrict: 'AE',
          scope : {
            show : '=',
            text : '='
          },
          link : function(scope, element, attrs, model){
            scope.type = function(){
                scope.text = scope.text+'0';
            };
            scope.done = function(){
                scope.show = false;
            };
            element.parent().append($compile(
                    '<div ng-show="show">'+
                    '<button ng-click="type()">0</button>'+
                    '<button ng-click="done()">x</button>'+
                    '</div>'
            )(scope));
         }
      };
    });

Plunker Here

Ng-Repeat Angular +触摸键盘

1 个答案: