AngularJS 和 FancyTree：事件触发，但参数未定义

Question

我正在尝试为 fancytree 编写一个指令。源代码是通过 ajax 加载的，几乎所有内容看起来都很吸引人。树正确显示，事件触发良好，但参数在控制器端未定义。

这看起来很奇怪，因为当我为事件设置 function(event, data){ ... } 时（如 activate 或 beforeSelect，如 docs 中所示）两个 event 和 data 设置得很好。

我哪里做错了？

提前致谢！

指令

angular.module('MyAppModule', [])
.provider('MyAppModuleConfig', function () {
    this.$get = function () {
        return this;
    };
})
.directive('fancytree', function () {
    return {
        restrict: 'E',
        transclude: true,
        replace: true,
        scope: {
            activateFn: '&',
            //long list of events, all stated with "<sth>Fn : '&'"
            selectFn: '&',
            selectedNode: '=',
            treeviewSource: '=',
            enabledExtensions: '=',
            filterOptions: '='
        },
        template: '<div id="treeview-container"></div>',
        link: function (scope, element) {
            element.fancytree({
                source: scope.treeviewSource,
                activate: function (event, data) {
                    console.log(event, data); // ok, parameters are all set
                    scope.activateFn(event, data); 
                    // function fires right, but all parameters 
                    // are logged as undefined
                }
            });
        }
    };
});

HTML

    <fancytree ng-if="tvSource" treeview-source="tvSource" 
        activate-fn="genericEvt(event, data)"/>

控制器

  TreeViewSvc.query()
      .success(function (response) {
          $timeout(function ()
          {
              $scope.tvSource = response;
          });
      });
  $scope.genericEvt = function (event, data) {
      console.log('event', event);
      console.log('data', data);
      // function is firing, but all parameters come undefined
  };

Answer 1

您在指令的函数绑定中遗漏了一个重要的部分。它们需要作为对象传入，属性名称与参数名称相同。即

scope.activateFn(event, data);

应该是

scope.activateFn({event: event,data: data});

或者换句话说，通过绑定函数（{event: e,data: d}）传入的对象的属性需要在消费者端指定为被绑定函数（genericEvt(event, data)）的参数。

虽然语法一开始可能会令人困惑，但您也可以使用 = 绑定而不是 &，尽管 & 专门用于函数绑定。例如：

 ....
 activateFn: '=',
 ....

和

 activate-fn="genericEvt"

AngularJS 和 FancyTree：事件触发，但参数未定义

AngularJS and FancyTree: Events firing, but with undefined parameters

javascript

angularjs

angularjs-directive

fancytree