继承与隔离范围的角度父指令属性

Question

我想从隔离范围的父定制指令继承属性。在下面的示例中，我希望能够通过myChild控制器或链接函数访问myParent上的api属性。我的最终目标是注入一个可由儿童和视图控制器访问的api实例。

<my-parent api="parentInstance1"> 
    <my-child ng-repeat="field in ::data" 
     ng-attr-src="{{field.src||undefined}}" 
    </my-child>   
</my-parent> 

<my-parent api="parentInstance2"> 
    <my-child ng-repeat="field in ::data" 
     ng-attr-src="{{field.src||undefined}}" 
    </my-child> 
</my-parent> 

两个指令的简化版本看起来像这样

app.directive('myParent', function() { 
    return { 
     transclude: true, 
     restrict: "E", 
     scope: { 
      api: '=?' 
     }, 
     template: '...', 
     controller: function ($scope, $attrs) { 

      // foo is injected from a factory instance 
      function foo () { 

      } 

      $scope.api = { 
       foo: foo 
      } 
     }, 
     link: function ($scope, $element, $attr) { 

     } 
    } 
}); 

app.directive('myChild', function() { 
    return { 
     require: "^myParent", 
     restrict: "E", 
     scope: { 
      api: '=?'     
     }, 
     template: "...", 
     controller: function ($scope) { 
      // I want to access $scope.api in link or controller    
     }, 
     link: function ($scope, $element, $attr) { 
      // I want to access $scope.api in link or controller 
     } 
    } 
}); 

我无法从子指令访问$ scope.api但$ scope.parentInstance1和$ scope.parentInstance2可见。我意识到我可以明确地声明，但我宁愿知道如何正确地做到这一点。

Answer 1

我不知道为什么你在my-parent引用parentInstance1和parentInstance2但my-child的属性在myParent的$scope，所以你可以参考实际$scope.api对象是myParent的$scope在my-child指示标记的属性然后在myChild指令的隔离范围定义中引用该属性的名称。

<my-child inner-api="api"></my-child> 

..然后在子指令......

app.directive('myChild', function() {  
... 
scope: { 
    innerApi: '=?' 
} 
... 
controller: function($scope) { 
    $scope.innerApi // <- accessible in the controller 
} 

继承人simplified fiddle ...