我正在尝试为 fancytree 编写一个指令。源代码是通过 ajax 加载的,几乎所有东西看起来都很迷人。树正确显示,事件触发良好,但参数在 Controller 端未定义。
这看起来很奇怪,因为当我为事件设置一个 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)"/>
Controller
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
};
最佳答案
您在指令的函数绑定(bind)中遗漏了一个重要的部分。它们需要作为属性名称与参数名称相同的对象传入。即
scope.activateFn(event, data);
应该是
scope.activateFn({event: event,data: data});
或者换句话说,通过绑定(bind)函数({event: e,data: d}
)传入的对象的属性需要被指定为被绑定(bind)函数的参数(genericEvt(event, data)
) 在消费者端。
尽管开始时语法可能会令人困惑,但您也可以使用 =
绑定(bind)而不是 &
,尽管要使用 &
专门用于函数绑定(bind)。例如:
....
activateFn: '=',
....
和
activate-fn="genericEvt"
关于javascript - AngularJS 和 FancyTree : Events firing, 但具有未定义的参数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33378188/