angularjs – 如何根据用户输入的$viewValue更新更新ngModel的$m

发布时间：2020-12-17 07:29:37 所属栏目：安全来源：网络整理

导读：说我有以下指令： myApp.directive('myDirective',function() { return { restrict: 'A',require: 'ngModel',scope: { ngModel: '=' },link: function(scope,elem,attrs,ngModelCtrl) { scope.$watch('ngModel',function() { ngModelCtrl.$modelValue = 'foo

说我有以下指令：

myApp.directive('myDirective',function() {
    return {
        restrict: 'A',require: 'ngModel',scope: {
            ngModel: '='
        },link: function(scope,elem,attrs,ngModelCtrl) {
            scope.$watch('ngModel',function() {
                ngModelCtrl.$modelValue = 'foo';
            });
        }
    }
});

以下html：

<input ng-model="name" my-directive></input>

基本上,每当用户更改输入时,my-directive理想情况下将内部模型值更改为“foo”,同时保持视图值不变.

但是当我在相应的控制器中打印出$scope.name时,它不会记录“foo”,它会记录用户输入的内容.

似乎ngModelCtrl.$modelValue不是控制器正在访问的 – 我是否错误地接近了这个问题？

(另外观看范围内的ngModel感觉真的错了,但我不确定是否有任何其他方式.任何建议都会非常感激！)

如果您正在寻找视图更改,则不应注册手表. ngModelController的 $viewChangeListeners专为此目的而设计,并避免在ngModel上创建任何额外的监视.您还可以删除ngModel上的双向绑定设置.

我能想到这种方式.

.directive('myDirective',function($parse) {
    return {
        restrict: 'A',ngModelCtrl) {
          /*Register a viewchange listener*/
          ngModelCtrl.$viewChangeListeners.push(function(){ 
              /*Set model value differently based on the viewvalue entered*/
              $parse(attrs.ngModel).assign(scope,ngModelCtrl.$viewValue.split(',')); 
          });
        }
    }
});

Demo

在思考它时(Credits @Cody),在使用$parser时,它变得更简洁和恰当.

ngModelCtrl.$parsers.push(function(val) { return val.split(',') });

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!