角度指令不起作用

时间:2018-02-06 04:43:59

标签: javascript html angularjs

我有一个文本框和一个指令来限制在屏幕上显示负值,而ng-model应该包含该负值。

在下面的指令中,我总是将""作为 inputValue 的值,如何获取 inputValue 的ng-model值

 app.directive('numberOnly', function () {

  return {
      require: 'ngModel',
      link: function (scope, element, attrs, modelCtrl) {
          modelCtrl.$parsers.push(function (inputValue) {
              if (inputValue == undefined) return '';
              var transformedInput = inputValue.replace(/[^0-9]/g, '');
              if (transformedInput != inputValue) {
                  modelCtrl.$setViewValue(transformedInput);
                  modelCtrl.$render();
              }
              return transformedInput;
          });
      }
  };
});

1 个答案:

答案 0 :(得分:2)

您的代码效果很好:

HTML

<div ng-app="myModule">
  <div ng-controller="myController">
    <input type="text" number-only ng-model="model"/>
  </div>
</div>

JS

var module = angular.module("myModule", []);

module.controller('myController', ['$scope', function($scope) {
  $scope.model = '01234';
}]);

module.directive('numberOnly', function() {

  return {
    require: 'ngModel',
    link: function(scope, element, attrs, modelCtrl) {
      modelCtrl.$parsers.push(function(inputValue) {
        // Value prints here
        console.log(inputValue);
        if (inputValue == undefined) return '';
        var transformedInput = inputValue.replace(/[^0-9]/g, '');
        if (transformedInput != inputValue) {
          modelCtrl.$setViewValue(transformedInput);
          modelCtrl.$render();
        }
        return transformedInput;
      });
    }
  };
});

演示

https://jsfiddle.net/bdmqxr5y/720/