更改ng-click函数属性。在Angular.js

Question

我有一个名为old（）的指令中定义的函数，当前按钮在单击时执行此函数。我想在加载指令时将old（）函数更改为new（）函数。新函数将通过参数（this.form）接收（“form”是我的表单的名称）。 我已经试过这一点，但它

attrs.$set('ngClick', 'new(this.form)'); 

，但不执行新的（）函数。我该怎么做？。 我需要在一个指令中做到这一点，也许它可以在控制器中实现，但我需要在指令中做到这一点，我把这个例子怀疑应用在我的真实项目中。非常感谢你。

http://jsfiddle.net/mg8g138x/

app.directive('validation', function ($timeout) { 

     return { 
      restrict: 'AE', 
      require: 'ngModel', 

      link: function (scope, element, attrs, ngModel) { 
       if (!ngModel){ 
       return;   
       } 

       scope.old= function(){ 
       alert("old") 
       } 
      //attrs.$set('ngClick', 'new(this.form)'); 
       scope.new= function(form){ 
       alert("new"); 
       console.log(form) 
       }     

      } 

     }; 
    }); 

Answer 1

我不知道你为什么会想这样做。实现一个函数，它将使用您需要实现的两个函数的用例。比如说，如果你想在启动过程中使用一些x函数，然后触发functionx，然后当一个动作发生时，然后触发函数old（）中调用。

我绝对不建议改变属性。但如果你真的想这样做，这是你可能想要它..

app.directive('validation', function ($timeout) { 

      return { 
       restrict: 'AE', 
       require: 'ngModel', 

       link: function (scope, element, attrs, ngModel) { 
        if (!ngModel){ 
        return;   
        } 

        scope.previous= function(){ 
        alert("old") 
        } 

       scope.old= scope.previous 

        scope.new= function(form){ 
        alert("new"); 
        console.log(form) 
        } 
       // Do this action may be within a function after an action 
       // or an event $emit/$broadcast rather than directly in code. 
       attrs.$set('ngClick', scope.old = scope.new); 
       } 

      }; 
     }); 

请看看这个stackoverflow以及。 attrs.$set('ngClick', functionName + '()'); no longer working in angular 1.2rc3

Answer 2

，而新的功能不工作是因为当时在链接功能运行代码，AngularJS已经完成了编译模板，并与向链路找到的所有指令（NG-点击）的原因范围。

将ng-click值更改为新函数后，您需要重新编译该指令才能使该更改生效。

你可以看看angularjs $ compile服务，看看它如何使用：https://docs.angularjs.org/api/ng/service/ $ compile。

不过，我不相信这是你的问题的最佳方法，因为JavaScript有一些功能的编程功能，它允许你通过一个函数作为参数，可以合并老功能和新功能成一个单一的功能，并控制其功能通过一个参数被调用，这里是例如：

link: function (scope, element, attrs, ngModel) { 
    if (!ngModel){ 
     return;   
    } 

    scope.old = function(){ 
     alert("old"); 
    } 

    scope.new = function(form){ 
     alert("new"); 
     console.log(form) 
    } 

    scope.current = scope.old; // variable to control with function being called 
    scope.form = ''; // variable to contain the parameter for the function called via ng-click 

    scope.binding_to_button = function(function_to_call, parameter) { 
     function_to_call(parameter); 
    } 
       // Do this action may be within a function after an action 
       // or an event $emit/$broadcast rather than directly in code. 
    scope.current = scope.new; 
    scope.form = form; // 
       } 

然后，代替结合scope.new或scope.old直接向您的纳克点击，绑定scope.binding_to_button。

ng-click="binding_to_button(current, form)" 

此功能将采取$ scope.current，因为它第一个参数，而$ scope.form作为其第二个，这样你就可以动态地控制该函数的调用，并传递给哪些参数他们通过点击事件。