从子指令获取角度父指令范围答案

【问题标题】：Get angular parent directive scope from child directive从子指令获取角度父指令范围
【发布时间】：2014-08-22 06:35:03
【问题描述】：

我正在尝试从子指令访问父指令的范围。请看jsbin

http://jsbin.com/tipekajegage/3/edit

当我点击按钮时，我想获取 prod 的值。

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

cpApp.directive('cpProduct', function(){
  var link = function (scope, element, attr) {
    console.log('scope.prod '+ scope.prod);
  };

  return {
    link: link,
restrict: 'EA',
scope: {
  prod: '='
    }
  };
});

cpApp.directive('mediaButtons', [function(){

var template = 
'<button ng-click="addToFavoriteList()">get prod from parent</div>' + 
'</button>';

var controller = function($scope){
    var vm = this;
    $scope.addToFavoriteList = function(event){
       console.log($scope.$parent.prod);
      //GET PROD?
    };

};
return {
    template: template,
    restrict: 'E',
    controller: controller,
    scope: true
};
}]);

【问题讨论】：

标签： angularjs directive

【解决方案1】：

您需要将父函数作为要求传入并将其分配给本地范围：

var linkFunction = function (scope, element, attrs, cpProductCtrl) {
    scope.prod=cpProductCtrl.prod;

你还需要像这样在父函数上定义一个控制器：

controller: function($scope){
   this.prod=$scope.prod; 
}

然后你可以像这样调用你的 clickHandler 方法：

console.log($scope.prod);

Here is the JS Bin 以防我错过了任何描述。

【讨论】：

感谢它的工作原理，但是在不需要 cpProduct 的地方没有办法让它更通用吗？我可能想在另一个具有 scope.prod 但不是 cpProduct 的指令中使用子指令。谢谢
这可能 - 不幸的是我没有时间解决这个问题。

【解决方案2】：

我稍微重构了您的代码，在您的 cpProduct 指令中创建了一个控制器，并要求它在 mediaButton 中访问其范围。

See this plunker

【讨论】：

谢谢。这行得通，似乎与上一个答案的想法相同。