Question

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

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

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

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-click）与指令范围链接起来。

将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 直接绑定到ng-click，而是绑定 scope.binding_to_button 。< / p>

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

此函数将 $ scope.current 作为第一个参数， $ scope.form 作为第二个参数，因此您可以动态控制哪个函数调用以及通过click事件传递给他们的参数。

更改ng-click功能属性。在Angular.js

2 个答案: