2013-12-03 2 views
3

Я хочу иметь настраиваемую директиву, которая многократно используется, и создает область изоляции, поэтому ее можно использовать в любом месте (до тех пор, пока потребитель использует API, определенный директивой). Затем я хочу, чтобы потребитель мог легко смешивать и сопоставлять различные многоразовые фрагменты, которые соответствуют основной директиве многократного использования.Совместное использование области выделения с вложенными директивами в Angular

Ситуация, с которой я работаю, - это выпадающее меню. Основная директива будет изолировать область действия и определить API для выпадающего списка в целом. Внутренние директивы позволят потребителю выбирать, хотят ли они кнопку, которая открывает меню,/поле ввода окна поиска, которая открывает меню и т.д. Затем они также могут выбрать то, что стиль меню используются:

<dropdown items="..." selected-item="..."> 
    <dropdown-button>(Transcluded button text here)</dropdown-button> 
    <dropdown-icon-list></dropdown-icon-list> 
</dropdown> 

Родительская директива/контроллер будет обрабатывать состояние/связь для внутренних частей (т. Е. Кнопка может инициировать «открытое» состояние, и список будет отвечать открытием). Другими словами, родительская директива обеспечит единое место для потребителя, чтобы определить поведение и изолировать область видимости от остальной части страницы, в то время как вложенные директивы изменят общее состояние/ответят на изменения в общем состоянии на основе их роли.

У меня на самом деле это работало, используя область выделения в главной директиве «выпадающего списка», а затем наследовав область с вложенными директивами (не указав «scope: ...» на вложенные директивы). Но с помощью Angular 1.2 все изменилось так, что изоляционная область родителя действительно изолирована - дети наследуют область действия, которая существует вне родительской директивы, а не разделяют ее изолированную область.

Что такое Угловой способ совершить такое?

Я начал переоснащать свой существующий код, чтобы разделить контроллер с родительской директивой с вложенными детьми, но я считаю, что это неправильный путь, когда я попадаю в ситуацию, когда дети должны слушать изменения на shared scope ... Единственный способ, которым я могу это сделать, - передать функцию обратного вызова из вложенных директив в общий контроллер, который будет привязан к $ scope. $ on method. Похоже, неправильный путь вниз.

+1

демо в plunker поможет ... вопрос слишком долго и без кода трудно disect – charlietfl

+0

Да, я беспокоился об этом. В сущности, вопрос заключается в следующем: как создать директиву, которая предоставляет определенную часть функций многократного использования, но позволяет потребителю рассказать о той директиве, которую делегаты используют для выполнения определенных функций общей функциональности. Я думаю, что у меня может быть решение, которое будет работать для меня, а именно для использования transclusion (и моей собственной функции компиляции), чтобы я мог предоставить родительскому объекту доступность для детей. Я отправлю решение с некоторыми примерами кода, если я его выясню. – timehat

+1

создайте демонстрационную версию в plunker или jsfiddle.net ....без кода невозможно разобрать то, что вы пытаетесь сделать. – charlietfl

ответ

0

Существует 3 типа префиксов, которые предоставляет AngularJS.

  1. "@" (Текст связывания/в одну сторону связывания)
  2. "=" (Прямая модель связывания/Двухсторонний связывание)
  3. "&" (Поведение связывания/Метод связывания)

Все эти префиксы получают данные из атрибутов элемента директивы и обеспечивают связь между директивами. перейдите по ссылке ниже для аналогичного вопроса.

Визит https://stackoverflow.com/a/33024209/4348824

Смежные вопросы