Передача директивы в директиву через объект в angularjs

0

Допустим, что имеется 2 директивных компонента
1) Список
2) Профиль

"Список" должен принимать данные в виде нотации объекта, переданные ему через контроллер, и отображать компоненты HTML или Директивы в виде списка. Например

var obj =[
{
component ://profile directive something like <Profile name="Shehzad" age=29/>
},
{
component ://news directive something like<News content="Headlines" />
}
];

И директива Profile содержит следующий интерфейс.
<div>
<div> name is {{name}}</div>
<div> age is {{age}}</div>
</div>

Аналогично директива News будет содержать следующий пользовательский интерфейс
<div>
<div>{{content}}</div>
</div>

Я хочу, чтобы компонент List читал "obj" и отображал директиву "Профиль" и "Новости" в представлении "Список". Может ли кто-нибудь объяснить вам, как это может быть достигнуто в angularjs

Вот ссылка plunker:
http://plnkr.co/edit/I1kJhYCqMkSD2qFIUQo8?p=preview

EDIT: plunker, чтобы показать, как добавить директиву динамически, например, попросил: http://plnkr.co/edit/U88iPk?p=preview

  • 0
    то, что вы опубликовали, не является допустимым JSON, но кажется, что вам нужно иметь выражение, которое при оценке является другой угловой конструкцией, которая затем будет скомпилирована, что не сработает.
  • 0
    Для чего бы это ни стоило, никогда не стоит хранить элементы пользовательского интерфейса в данных.
Показать ещё 5 комментариев
Теги:
angularjs-directive
angularjs-controller

1 ответ

0

вы хотите использовать директиву в другой директиве, поэтому добавьте ее в представление списка List следующим образом:

<div ng-repeat="profile in profiles" >
<profile name="{{profile.name}}" age="{{profile.age}}" ></profile>
</div>
  • 0
    Тогда этот код будет тесно связан только с профилем и списком. Я не смогу повторно использовать этот код для других компонентов, таких как новости, сообщения, погода и т. Д. Из приведенного выше фрагмента кода я хочу, чтобы компонент профиля был динамически введен в список. так что любой другой компонент может быть использован в списке.
  • 0
    Поэтому попробуйте использовать ng- transclude - docs.angularjs.org/api/ng/directive/ngTransclude
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню