Директивные контроллеры AngularJS, требующие родительских контроллеров директив?

Я мог бы думать об этом полностью задом наперед, но я пытаюсь создать три вложенные директивы, давайте их назовем: screen, component и widget. Я хочу, чтобы виджет мог вызывать некоторое поведение в компоненте, что, в свою очередь, вызывает некоторое поведение на экране. Так:

.directive('screen', function() {
    return {
        scope: true,
        controller: function() {
            this.doSomethingScreeny = function() {
                alert("screeny!");
            }
        }
    }
})

.directive('component', function() {
    return {
        scope: true,
        controller: function() {
            this.componentFunction = function() {
                WHAT.doSomethingScreeny();
            }
        }
    }
})

.directive('widget', function() {
    return {
        scope: true,
        require: "^component",
        link: function(scope, element, attrs, componentCtrl) {
            scope.widgetIt = function() {
                componentCtrl.componentFunction();
            };
        }
    }
})

<div screen>
    <div component>
        <div widget>
            <button ng-click="widgetIt()">Woo Hoo</button>
        </div>
    </div>
</div>

Я могу требовать родительских компонентов в ссылке виджета FN с помощьюrequire: "^component", но как мне дополнительно предоставить компоненту контроллера доступ к содержащему его экрану?

Что мне нужно, это то, что в компоненте, поэтому, когда вы нажимаете кнопку виджета, он предупреждает «скрининг!».

Благодарю.

Ответы на вопрос(4)

Ваш ответ на вопрос