CODEWITHSUNDEEP
dartangular-dart
TWL
TWL

Reputation: 216

Specific design issue when dealing with subcomponents in AngularDart

Let's say I have 2 components, cmp1 and cmp2. cmp1 will loop through a list and create cmp2's for every item. In cmp2, I want to display the person data.

//component 1
@Component(selector: 'cmp1', 
           templateUrl: 'cmp1.html', 
           publishAs: 'cmp')    
class cmp1 {
  List myList;

  cmp1(){
    this.myList = [{'name':'foo','age':20},{'name':'bar','age':30}];
  }
}

In cmp1.html

<cmp2 ng-repeat='person in cmp.myList'></cmp2>

//component 2
@Component(selector: 'cmp2', 
           templateUrl: 'cmp2.html', 
           publishAs: 'cmp')    
class cmp2 {}

In cmp2.html

<span>name: *display person name*</span>

Upvotes: 2

Views: 135

Answers (1)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657929

If you want to do it this way you need a @NgAttr('person') Map person; in cmp2.

// cmp1.html

<cmp2 person="{{person}}" ng-repeat="person in cmp.myList"></cmp2>

// cmp2.html

<span>name: {{cmp2.person['name']}}</span>

not tested

Upvotes: 1

Related Questions