CODEWITHSUNDEEP
angularnestedcomponents
AHmedRef
AHmedRef

Reputation: 2621

How to send multiple objects to nested child component in one input using Angular 6

I would like to send multiple objects or parameters to child component using one input : 

<child [OneInput]="{object1,object2}"></child>

Because in child component im usnig set method to get data from parent component

@Input()
set OneInput(data)
{
 console.log(data)
}

i don't want to create a separated variable kind let obj= {obj1:data1,obj2:data2}

Any help please.

Upvotes: 1

Views: 1623

Answers (1)

KShewengger
KShewengger

Reputation: 8269

If on your component, you specify 2 variables that you want to pass in your template then you can directly pass it on [OneInput]

ParentComponent

@Component({
   ...,
   template: `<child [OneInput]="{userList: users, positionList: positions}"></child>`
})
export class ParentComponent {

   users = ['user1', 'user2'];
   positions = ['position1', 'position2'];

}

ChildComponent

@Component({...})
export class ChildComponent {

   @Input()
   set OneInput({userList, positionList}) {    // You can use data or you can destructure it to directly access the objects without having to data.userList and data.positionList
      console.log(userList, positionList)
   }

}

Upvotes: 2

Related Questions