Как получить родительский (/ родительский/родительский/.. и т. Д.) Контроллер изнутри директивы?

Question

У меня есть 3 директивы, структура может выглядеть примерно так:

<my-component> 
    <my-items> 
     <my-item="item" ng-repeat="item in MyItems.items"> 
      {{ item.name }} 
      <!-- item.children --> 
      <my-items> 
       <my-item="item" ng-repeat="item in MyItems.items" /> 
      </my-items> 
     </my-item> 
    <my-items> 
</my-component> 

, где глубина my-items может быть бесконечным (в теории).

Теперь я хочу, чтобы иметь my-component держать (ОДИН!) Элемент, который пользователь выбирает и добавить условный выбранный класс, так что в (~ псевдо) код, который будет выглядеть примерно так:

<my-item="item" ng-click="myComponent.selected = item" 
       ng-class="{ selected: myComponent.selected == item }" /> 

Как я могу узнать здесь, что выбранный элемент из my-component?

Я попытался сделать это в директиве myItems:

// itemsComponentController is the controller of my-component 
require: "^^itemsComponentController"; 

Но угловой здесь бросает ошибку, что не может найти такой контроллер. Что я делаю неправильно здесь с require? Разве он не находит контроллеров, которые не являются его прямыми родителями?

Я это работает на излучающий «пункт выбранный» событие, которое обрабатывается в контроллере, делая scope.$on("item-selected"), но я до сих пор не знаю, что myComponent.selected в <my-item>

См this jsfiddle для (минималистичный?) машинописная версия этой проблемы.

Answer 1

Я нашел проблему!

Мне не нужно запрашивать имя контроллера, но вместо этого требуется имя директивы. Затем контроллер этой директивы будет передан в качестве переменной в функции link:

// Require the name of the (parent) directive instead of its controller name 
require: "^^myComponent"; 
link: function(scope, elem, attrs, ctrl) { 
    // ctrl is the controller of <my-component> 
    // so now I can do ctrl.itemSelected() 
} 

The working jsfiddle