AngularJS指令回调 [英] AngularJS Directive Callback
本文介绍了AngularJS指令回调的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想通过标签上的参数将调用发送回指令,然后在指令内部适当时调用该方法.例如,当单击按钮时,调用父控制器上的方法.
I would like to send a call back into a directive via a parameter on the tag, and then call that method when appropriate inside the directive. For example, when a button was clicked call a method on the parent controller.
我有一个简单的 plunker ,它不起作用
I have a simple plunker of it not working
html文件:
<body ng-controller="ParentController">
<h1> Method Arguments </h1>
<h3> open console to view output</h3>
<hello-world onLoadCallback="myCallback(arg1)"></hello-world>
</body>
javascript文件:
javascript file:
var app = angular.module("app",[]);
function ParentController($scope) {
$scope.myCallback = function(var1){
console.log("myCallback", var1);
}
}
app.directive('helloWorld', function() {
return {
restrict: 'AE',
template: '<h3>Hello World!!</h3>',
scope:{
onLoadCallback: '&'
},
link: function(scope, element, attrs, dateTimeController) {
console.log('linked directive, not calling callback')
scope.onLoadCallback('wtf');
}
};
});
推荐答案
棘手的棘手角度,在HTML中声明参数时,它需要使用蛇形大小写而不是驼峰形匹配.
Tricky tricky angular, when declaring the argument in the HTML, it needs to use snake case, instead of camelcase to match.
作品:
<hello-world on-load-callback="myCallback(arg1)"></hello-world>
不起作用:
<hello-world onLoadCallback="myCallback(arg1)"></hello-world>
这篇关于AngularJS指令回调的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文