Связь между несколькими слоями вложенных директив

Question

Это немного сложный, так что медведь со мной. У меня есть три слоя директив:

1. Верхний слой - всплывающий директива
2. Средний слой - switch-pane директива *
3. Нижний слой - один из нескольких представлений

Верхний слой это просто всплывающее окно, которое представляет собой мастер в моем приложении. Средний уровень - это директива, которую я сделал, которая представляет собой стек представлений - вы можете «толкнуть» и «поп-шоу». Отображается «верхний» вид, а остальные отбрасываются и размываются. Нижний уровень - это куча представлений, которые обычно не связаны друг с другом, которые динамически загружаются и отображаются в switch-pane в соответствии с тем, что делает пользователь.

До сих пор это работает, НО: в настоящее время, верхний слой $scope имеет свойство массива, который представляет все представления switch-pane должен отображаться, сообщаемые в switch-pane директивы в качестве атрибута, а switch-pane директивы $watch эсов он и обновление сам. Это нормально, но я не думаю, что это достаточно хорошо. Мне бы хотелось, чтобы сама директива switch-pane справилась со стеком взглядов и только открыла API и pop.

Вот несколько способов, я думал:

• Использование $broadcast/$emit - верхний слой будет $ транслировать «толчок» событие и switch-pane будет поймать его и делать все, что ему нужно
• Использование услугу (для подписки и запуска события «push» - это точно так же, как с использованием $broadcast, но не распространяется по всему объему дерева
• Использование службы, которая позволяет директиве switch-pane зарегистрировать собственный API. его идентификации, например, атрибута те или даже элемент ID
• Использование angular.element().scope(), чтобы получить доступ к внутренней работе switch-pane «s

Честно говоря, мне не нравится какой-либо из этих методов много. Конечно, я хочу избежать привязки к DOM, так что последние 2 хуже.

Любые другие способы сделать это? Какой из них наиболее угловатый, чтобы выставить API директивы, учитывая, что мы действительно не имеем доступа к определенному экземпляру директивы, кроме как через DOM?

Answer 1

Вы можете проверить, как реализованы ng-form, и ng-input. В принципе, если форма имеет имя, например <form name="foo" ...>, ее контроллер публикуется в текущей области, в данном случае под переменной $scope.foo. После публикации контроллера вы можете использовать его API за пределами директивы ng-form.

Вы также можете получить доступ к этому контроллеру из другой директивы, если указан параметр require: "^ngForm".

Вот пример, взятый из моего проекта.Это своего рода оболочка для плагина сетки jqGrid, написанная в jQuery: https://github.com/9ci/angle-grinder/blob/06856b0d940b572960025f06f470c2f40fdc0ceb/app/scripts/modules/gridz.coffee#L12