Question

我想在angular.so中扩展默认的inputDirective，我写了这些代码：

module.config(function($provide){
    $provide.decorator('inputDirective',function($delegate){
       var directive = $delegate[0];
       var originalLink = directive.link;
       directive.compile=function(ele,attr,transclude){
          return function(scope,ele,attr,contr){
            ele.on('click',function(){
                scope.amount=888;
            })
            originalLink.apply(this,arguments);
            return originalLink;
          }
       }
    })
})


<form name='simpleForm'>
  <input name='times' ng-model='times'/>
</form>

由于这些代码，我想要这样的结果：当我点击输入元素时，我的控制器中的$ scope.amount将是888。现在，它确实有效，但$ scope.simpleForm和$ scope.simpleForm.times仍然是原始的。 $ dirty属性仍然是错误的。

我很困惑，为什么这样？

我需要帮助。谢谢大家。

Answer 1

首先，我不确定您的代码是否可行：link函数应该从compile函数输出。然后，我认为你正在使用jQuery。使用jQlite（AngularJS＆＃39; vanilla版本附带），您必须使用bind绑定您的活动。

最后，$dirty标记开箱即用：当您开始输入输入时它变为true：）

HTML部分：

<div>
  <form name='simpleForm'>
    <input name='times' ng-model='times'/>
    <p ng-show="simpleForm.times.$dirty">Is dirty !</p>
  </form>
</div>

JS部分：

var myApp = angular.module('myApp',[]);

myApp.config(function($provide){
    $provide.decorator('inputDirective',function($delegate){
       var directive = $delegate[0];
       var compileFn = directive.compile;
       directive.compile=function(ele,attr,transclude){
            var linkFn = compileFn.apply(this, arguments);
          return function(scope,ele,attr,contr){
          //debugger;
            ele.bind('click', function() {
                    // debugger;
                alert('ok');
            });
            linkFn.apply(this,arguments);
            return linkFn;
          }
       }
       return $delegate;
    })
})

PS：I jsfiddled the code以便你可以试试......

当我在$ provide.decorator中更改输入值时，为什么我的角形不脏？

1 个答案: