2015-11-07 53 views
1

我试图让我的指令传递参数给调用者,但我无法让它工作。AngularJS - 在指令回调中包含变量

注:I 可以不带参数调用该函数。但只要我添加的参数,它打破:

这里是Plunker:(http://embed.plnkr.co/autsgiBlWjz8cX2BL6Sj/preview

供您参考,这里是代码:

//代码放在这里 角 .module ('myApp',[]);

angular 
    .module('myApp') 
    .directive('myDirective', myDirective) 
    .controller('ParentController', ParentController); 

function myDirective() { 
    return { 
    restrict: 'E', 
    controller: {}, 
    controllerAs: 'vm', 
    bindToController: { 
     myCallback: '&' 
    }, 
    scope: {}, 
    template: '<div><button data-ng-click="myCallback({msg:123})Call Callback</button></div>' 
    }; 
} 

function ParentController() { 
    var self = this; 

    self.parentCallback = parentCallback; 

    function parentCallback(args) { 
    alert('The message is: ' + args.msg); 
    } 
} 

HTML代码在这里:

<head> 
    <script data-require="[email protected]*" data-semver="2.0.0-alpha.45" src="https://code.angularjs.org/2.0.0-alpha.45/angular2.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="script.js"></script> 
    </head> 

    <body> 
    <div data-ng-app="myApp" data-ng-controller="ParentController as ctrl"> 
     <my-directive my-callback="ctrl.parentCallback(args)"></my-directive> 
    </div> 
    </body> 

</html> 

回答

0

angular doc

通常它是期望经由 表达来自分离范围传递数据到母体范围,这可以通过传递的地图来完成将个局部变量名称和值放入表达式包装函数fn中。例如,对于 示例,hideDialog函数会在 对话框隐藏时显示一条消息。这在指令中通过调用 close({message:'now for now'})来指定。然后,本地变量消息 将在开 - 关表达式中可用。

如果你想收到args以这种方式,<my-directive>的模板应该像下面。

<div><button data-ng-click="myCallback({args: {msg:123}})">Call Callback</button></div>