javascript - 从 Angular Directive(指令)调用父 Controller 的功能

Question

jsfiddle

我在名为 ball 的指令中有一个 ng-click。我正在尝试调用 MainCtrl 的函数 test() 并提醒球的 ng-repeat's alignment 的值。 为什么我无法识别 MainCtrl 的测试功能？ 变种$范围； var app = angular.module('miniapp', []);

app.controller('MainCtrl', function($scope) {
    $scope.project = {"name":"sup"};

    $scope.test = function(value) {
        alert(value);   
    }
    $scope.test2 = function(value) {
        alert('yo'+value);   
    }

}).directive('ball', function () {
        return {
            restrict:'E',
            scope: {
                'test': '&test'
            },
            template: '<div class="alignment-box" ng-repeat="alignment in [0,1,2,3,4]" ng-click="test(alignment)" val="{{alignment}}">{{alignment}}</div>'

        };
    });

html

<div ng-app="miniapp">
   <div ng-controller="MainCtrl">
       {{project}}
       <ball></ball>
   </div>
</div>

Answer 1

您需要将 test() 方法从 Controller 传递到指令中...

<div ng-app="miniapp">
   <div ng-controller="MainCtrl">
       {{project}}
       <ball test="test"></ball>
   </div>
</div>

将指令中的&改为=:

scope: {
    'test': '=test'
}

fiddle :http://jsfiddle.net/89AYX/49/