jazean
jazean

Reputation: 191

Passing a directive to directive via an object in angularjs

Lets say there are 2 directive components
1) List
2) Profile

"List" should accept the data in the form of Object notation passed to it through the controller and display the HTML or Directive components in the form of List. For example

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

And the Profile directive contains the following UI
<div>
<div> name is {{name}}</div>
<div> age is {{age}}</div>
</div>

Similarly News directive will contain the following UI
<div>
<div>{{content}}</div>
</div>

I want the List component to read the "obj" and render the Profile and news directive in a List view. Can anyone plz explain how the above thing can be achieved in angularjs

Here is the plunker link:
http://plnkr.co/edit/I1kJhYCqMkSD2qFIUQo8?p=preview

EDIT: plunker to show how to add directive dynamically like asked http://plnkr.co/edit/U88iPk?p=preview

Upvotes: 0

Views: 66

Answers (1)

Maciej Sikora
Maciej Sikora

Reputation: 20162

you want to use directive in other directive, so add it on List directive view like that:

<div ng-repeat="profile in profiles" >
<profile name="{{profile.name}}" age="{{profile.age}}" ></profile>
</div>

Upvotes: 0

Related Questions