如何将参数传递给控制器​​中定义的方法,但是从Angularjs中的指令调用?

sna*_*ggs 4 angularjs angularjs-directive

我尝试将一个参数从指令传递给控制器​​中定义的方法.

我使用隔离范围.

这是相关的代码和小提琴演示:

HTML

 <div ng-controller="MapCtrl">
        <map id="map_canvas" call='callMe()'></map>
    </div>
Run Code Online (Sandbox Code Playgroud)

JS

var module = angular.module('googleMap', []);

module.directive('map', function() {
    return {
        restrict: 'E',
        replace: true,
        scope:{
            callMe : '&call'
        },
        template: '<div></div>',
        link: function(scope, element, attrs) {
            console.log(element);

           /* ... */                
           scope.callMe('hey');

           /* ... */                                
        }
    };
});

function MapCtrl($scope) {

    $scope.callMe = function(val){
    alert(val);
    };

}
Run Code Online (Sandbox Code Playgroud)

为什么我得到val=undefined?它应该是hey

谢谢,

Ste*_*wie 6

您需要注释您的函数参数:

小提琴

视图:

<map id="map_canvas" call='callMe(param)'></map>
Run Code Online (Sandbox Code Playgroud)

指示:

scope.callMe({param: 'hey'});
Run Code Online (Sandbox Code Playgroud)

在文档中解释(虽然有些模糊):

&or&attr - 提供在父作用域的上下文中执行表达式的方法.如果未指定attr名称,则假定属性名称与本地名称相同.范围的给定和窗口小部件定义:{localFn:'&myAttr'},然后隔离范围属性localFn将指向count = count + value表达式的函数包装器.通常需要通过表达式将数据从隔离范围传递到父范围,这可以通过将局部变量名称和值的映射传递到表达式包装器fn来完成.例如,如果表达式是increment(amount),那么我们可以通过将localFn称为localFn({amount:22})来指定金额值.