如何訪問嵌套的Angular指令的作用域屬性

Question

我在訪問Angular的內部指令的作用域時遇到問題。

我已經創建了兩個指令，一個內部指令和一個外部指令。我希望他們都有隔離範圍。我希望內部指令是表單標籤上的一個屬性，並且我希望在提交表單時調用內部指令作用域的函數。

不幸的是，我似乎無法得到它的工作。

爲什麼我不能訪問內部指令的doThing函數？另外，如果我將innerDirective更改爲scope：false，我無法訪問外部指令的doSomething函數。我不確定我在這裏錯過了什麼。

http://codepen.io/justinbc820/pen/vNBWMp

angular.module('app', []) 
.directive('outerDirective', function() { 
    return { 
     restrict: 'E', 
     scope: {}, 
     link: function(scope) { 
      scope.doThing = function() { 
       alert('outer directive'); 
      } 
     } 
    }; 
}) 
.directive('innerDirective', function() { 
    return { 
     restrict: 'A', 
     scope: {}, 
     link: function(scope, element) { 
      scope.doThing = function() { 
       alert('inner directive'); 
      } 
     } 
    }; 
}); 


<div ng-app="app"> 
    <outer-directive> 

    <form inner-directive ng-submit="doThing()"> 
     <button type="submit">Do THING</button> 
    </form> 

    </outer-directive> 
</div> 

Answer 1

可以在innerDirective使用範圍。$父如下。

.directive('innerDirective', function() { 
    return { 
     restrict: 'A', 
     scope: {}, 
     link: function(scope, element) { 
     scope.$parent.doThing = function() { 
      alert('inner directive');   
     } 
     } 
};