AngularJS - 無法在另一個指令中訪問指令控制器

Question

我有兩個angularjs指令（extWindow和taskBar），並且想要將taskBar的控制器注入extWindow以訪問它的作用域。因爲它們不共享我使用的相同範圍

require : '^$directive' 

語法包含它。 這樣做，我可以擺脫'指令'extWindow'所需的錯誤「控制器'taskBar'，找不到'！但TaskBarCtrl在extWindow指令的鏈接（..）方法中仍未定義。

任何建議如何解決它？

var mod = angular.module('ui', []) 
.directive('taskBar', function() { 

    var link = function(scope, el, attrs) { 
     $(el).css('display', 'block'); 
     $(scope.titles).each(function(i,t) { 
      el.append('<span>' + t + '</span>') 
     }); 
    }; 

    return { 
     scope: {}, 
     restrict : 'E', 
     controller: function($scope, $element, $attrs) { 

      $scope.titles = []; 

      this.addTitle = function(title) {    
       $scope.titles.push(w); 
      }; 

      this.removeTitle = function(title) { 
       $scope.titles = jQuery.grep(function(n,i) { 
        return title != n; 
       }); 
      } 
     }, 
     link: link 
    }; 
}).directive('extWindow', function() { 

    return { 
     scope: {}, 
     require: '^?taskBar', 
     restrict: 'E', 
     transclude: true, 
     template: '<div class="ui-window">\ 
      <div class="ui-window-header"><span>{{windowTitle}}</span><div class="ui-window-close" ng-click="close()">X</div></div>\ 
      <div class="ui-window-content" ng-transclude></div>\ 
      </div>', 
     link: function(scope, element, attrs, taskBarCtrl) { 
      scope.windowTitle = attrs['windowTitle']; 
      scope.close = function() { 
       $(element).css('display', 'none'); 
      } 
      //taskBarCtrl is not recognized!!! 
      taskBarCtrl.addTitle(scope.windowTitle); 
     } 
    } 
}); 

http://jsfiddle.net/wa9fs2nm/

謝謝。 golbie。

Answer 1

如果你的父指令有一個控制器，並且你需要類似的東西。

this.scope = $scope; 
this.attrs = $attrs; 

而在你在你的子鏈接功能，你需要像

var Ctrl = ctrl || scope.$parent.tBarCtrl; 

這裏有一個Plunker