2015-10-19 87 views
0

我正在製作一個字段的表,並添加新行的選項。最後,我會打印所有的領域。 我要做的應用是觸摸顯示器,所以我做了一個新的鍵盤。 問題是,如果我按下此鍵盤的按鈕,我可以讀取相應的輸入,但我無法讀取json數組。但是,如果我在這個輸入與計算機的鍵盤寫入,我可以看到在陣列中按下的鍵。吳重複角度+觸摸鍵盤

這裏不是我的應用程序,它只是一個簡單的例子來向你展示我的問題:http://plnkr.co/edit/4cP2xSDRgvHG29RuA92N?p=preview

這裏是鍵盤的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()); 
     } 
    } 
    }); 
}); 

謝謝!!

回答

0

使用角度排除的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

+0

的指令,如果你有很多按鈕,併爲不同的按鈕組不同的功能使用的模板。你將面臨的一個問題與文本框中的光標有關。 –