angularjs: 指令中有多个绑定函数

Question

我的指令中有一个函数绑定到控制器中的函数，如下所示：

HTML:

<div graph-visualization data="graphdata" type="graphtype" data-method="watchMonth" timespan="timespan" id="graph" ng-if="!loading">
</div>

指令：

app.directive('graphVisualization', function() {
    return {
        restrict: 'A',
        scope: {
          data: '=',
          type: '=',
          timespan: '=',
          monthFilter: '&method'
        },
        link: function(scope, element, attrs) {
            scope.updateMonth = function() {
                var func = scope.monthFilter();
                func(scope.month)
            }

            scope.$watchGroup(['data', 'timespan', 'type'], function(newval, oldval) {
                 scope.month = 'something'
                 scope.updateMonth()
            })
})

控制器：

$scope.watchMonth = function(value) {
    //handle value passed from directive
}

如您所见，我的控制器中有一个绑定函数 'watchMonth'，它是从指令调用的。现在，我想在我的指令中添加另一个函数，该函数绑定到我的控制器中的其他函数。我该怎么做？似乎无法理解它。

我想要的是在我的指令中处理一次点击并根据该点击获取一个值。现在，我想将此值传递给控制器，控制器将修改控制器中的 'graphdata'（我在其上提供了一个监视组）。

Answer 1

在html中添加方法如图： month-filter="watchMonth()" second-function="function()"

一定要在函数名末尾加上括号

  <div graph-visualization data="graphdata" type="graphtype" month-filter="watchMonth()" second-function="secondFunction()" timespan="timespan" id="graph" ng-if="!loading">

app.directive('graphVisualization', function() {
return {
    restrict: 'A',
    scope: {
      data: '=',
      type: '=',
      timespan: '=',
      monthFilter: '&',
      secondFunction: '&'
    },
    link: function(scope, element, attrs) {
        scope.updateMonth = function() {
            var func = scope.monthFilter();
            func(scope.month)
        }

        scope.$watchGroup(['data', 'timespan', 'type'], function(newval, oldval) {
             scope.month = 'something'
             scope.updateMonth()
        })

})

添加了一个 plunker，也许这会有所帮助 http://plnkr.co/edit/cISSlQpQF6lFQrDdbTg4?p=preview

angularjs: 指令中有多个绑定函数

angularjs: multiple binded functions in directive

javascript

angularjs

angularjs-directive

angularjs-controller

angular-directive