來自內部指令與主指令的通信 - 調用函數

Question

我有兩個指令。首先是使用（包括）秒。

這是我的孩子的指令：

angular.module('myApp') 
    .directive('radioType', function() { 
    return { 
     restrict: 'E', 
     scope: { 
     question: '=', 
     onAnswer: '&' 
     }, 
     template: [ 
     '<div>{{vm.question.text}}<br/>', 
     '<div>', 
     '<button ng-repeat="a in vm.question.answers track by $index" ng-click="onSelected(a)">{{a.text}}</button>', 
     '</div>', 
     '<button ng-click="myFunction()">Radio</button>', 
     '</div>' 
     ].join(''), 
     controller: ['$scope', function($scope) { 
     $scope.myFunction = function() { 
      console.log("hello from radio controller"); 
      $scope.vm.onAnswer(); 
     }; 
     $scope.onSelected = function(question) { 
      $scope.vm.question.answer = question.text; 
      console.log(question); 
     }; 
     }], 
     controllerAs: 'vm', 
     bindToController: true 
    }; 
    }); 

，這是我的主要指令：

angular.module('myApp') 
.directive('question', function($compile) { 
    var combo = '<div>COMBO - {{vm.content.text}}</div>'; 
    var radio = [ 
    '<radio-type question="vm.content" onAnswer="vm.onAnswer()"></radio-type>' 
    ].join(''); 
    var input = [ 
    '<input-type question="vm.content"></input-type>', 
    ].join(''); 

    var getTemplate = function(contentType) { 
    var template = ''; 

    switch (contentType) { 
     case 'combo': 
     template = combo; 
     break; 
     case 'radio': 
     template = radio; 
     break; 
     case 'input': 
     template = input; 
     break; 
    } 

    return template; 
    } 

    var linker = function(scope, element, attrs) { 

    scope.$watch('vm.content', function() { 
     element.html(getTemplate(scope.vm.content.type)) 
     $compile(element.contents())(scope); 

    }); 
    } 

    return { 
    restrict: "E", 
    link: linker, 
    scope: { 
     content: '=' 
    }, 
    controller: ['$scope', function($scope) { 
     $scope.onAnswer = function() { 
     console.log("answer"); 
     }; 
    }], 
    controllerAs: 'vm', 
    bindToController: true 
    }; 
}) 

裏面的孩子指示我有按鈕，當有人點擊其中一個，我想從主指令調用函數。 我在我的子指令中包含了onAnswer: '&'，並且我在主目錄模板中分配函數，但是我可以得到這個工作。

下面是Plunker顯示我的問題：http://plnkr.co/edit/iWU4L3IJLHtADHBl2dIh?p=preview

任何其他意見都歡迎。

Answer 1

您在scripts.js上有2個錯誤。

第6行你的屬性不應該駝峯：

'<radio-type question="vm.content" on-answer="vm.onAnswer()"></radio-type>' 

和第46行的功能應該是裏面的對象vm：

$scope.vm.onAnswer = function() { 

入住此plunker：http://plnkr.co/edit/8O7BRjfE3ZWFLrvMkbXB?p=preview