具有未知参数数量的角度指令函数

时间:2015-12-15 14:32:17

标签: angularjs function angularjs-directive parameters

我想使用这样的指令:

<my-directive some-method="method(arg0, arg1)"></my-directive>

该指令如下:

angular.module('module').directive('myDirective', directive);

   function directive() {
        return {
            restrict:'E',
            scope: {
                someMethod: '&'
            },
            template:'<div ng-click="someMethod()"></div>'
        };
    };

我打电话给method(arg0, arg1)时打电话给someMethod()。有可能吗?

2 个答案:

答案 0 :(得分:2)

您可以将这两个参数绑定为模板中的属性。您可以在指令链接功能中访问这两个参数。下面的例子我只是在控制台中显示这两个参数。

我的建议:您不需要传递函数 someMethod ,您可以在指令中定义 someMethod 函数。检查链接会话中的注释代码。

指令:

angular.module('module').directive('myDirective', directive);

function directive() {
    return {
        restrict:'E',
        scope: {
            someMethod: '&',
            firstArg: '=',
            secondArg: '=',
        },
        link: function (scope, element, attr) {
          console.log(scope.firstArg);
          console.log(scope.secondArg);

          /*  function someMethod( arg0, arg1) {
           *  implement the someMethod based on your logic.  
           *
           *  }
           */
        },
        template:'<div ng-click="someMethod()"></div>
    };
};

HTML:

<my-directive some-method="method" firstArg="arg0" secondArg="arg1"></my-directive>

答案 1 :(得分:2)

根据您使用的角度版本,您应该使用什么。见http://jsfiddle.net/TheSharpieOne/b7btgudo/

请注意,不需要绑定参数。请参阅控制台日志以获取输出。

angular.module('app', [])
.controller("myCtrl", myCtrl)
.directive('myDirective', directive);

   function directive() {
        return {
            restrict:'E',
            scope: {
                someMethod: '&'
            },
            template:'<div ng-click="someMethod()">Click Here</div>'
        };
    }

    function myCtrl($scope){
      $scope.myMethod = console.log.bind(console);
      $scope.something = "something";
      $scope.somethingElse = "somethingElse";
    }

简单的HTML:

<div ng-app="app" ng-controller="myCtrl">
 <my-directive some-method="myMethod(something, somethingElse)"></my-directive>
</div>

如果您使用的是ControllerAs语法,则需要确保使用&#39;作用域&#39; this上的函数/变量,并使用HTML中的点符号。