（AngularJS 指令）更改输入模糊的模型值

Question

我有一个 ng-model 输入元素，我想在其中输入整数、正数，但如果输入为空，则将模型值设置为“1”。

我创建了一个指令，但在输入模糊后它没有将模型值更改为“1”：

angular.module('myapp', [])
.controller('MainCtrl', function ($scope) {
  $scope.item = { qty: 2 };
})
.directive('cartQty', function () {
  return {
    require: 'ngModel',
    link: function (scope, elem) {
        scope.$watch('item.qty', function (newValue, oldValue) {
            var arr = String(newValue).split('');
            if (arr.length == 0) return;
            if (newValue == 0) scope.item.qty = 1;
            if (isNaN(newValue)) scope.item.qty = oldValue;
        });
        elem.on('blur', function () {
            var value = String(elem[0].value);
            if (value.length == 0) scope.item.qty = 1;
        });
    }
  };
});

这是实时 JSFiddle 示例：http://jsfiddle.net/buh86w8n/2/

有没有人可以帮助我？

Answer 1

elem.on('blur', function(){ // code..}) 在 angular 范围之外。

要在 elem.on blur 事件中更改范围值，您必须调用 $apply().

这里是working plunkr

elem.on 模糊事件 :

elem.on('blur', function () {
    var value = String(elem[0].value);
    if (value.length == 0){
        scope.item.qty = 1;
        scope.$apply();
    }
});

Answer 2

或者你可以只 $watch 那个输入，如果它是空的，将它设置为 1。

所以它以2开头，如果你删除它，它将设置为1，否则设置为任意数字。

这是您编辑的代码：

http://jsfiddle.net/buh86w8n/4/

（AngularJS 指令）更改输入模糊的模型值

(AngularJS Directive) Change model value on input blur

javascript

model

input

onblur

angularjs