Angular dynamic properties into a component

Question

I need to dynamically insert properties into third-party components. I get an object with the settings and I need to put it in the component, but the individual properties set themselves from that object. Key and value. Is it possible?

for eaxample:

export class SomeComponent {
   @input Prop1;
   @input Prop2;
}


export class MainComponent {
   someObj = {Prop1: "Value1", Prop2: "Value2"};
   someArray = [1,2];

}

in MainComponent Template:

i cant do that:

<div *ngFor="let item of someArray>
  <some-component prop1="value1" prop2="value2"></some-component>
</div>

but thats how I need it

<div *ngFor="let item of someArray>
  <some-component {{someObj}}></some-component>
</div>

I will need to dynamically list the components and insert some settings that can always be different. Sorry for english. Thanks for answers :)

angular version: 8.2.7

your question is WAY to broad. some code will help. what is that mysterious 3rd party component ? what does your object looks like ? are you using your DOM or angular to fetch it ? — Stavm, Sep 21 '19 at 10:08
I created an example. thank you for answer. I learn angular a few days — Lukáš Máška, Sep 21 '19 at 10:30
you're looking for something like this? https://stackoverflow.com/questions/35534959/access-key-and-value-of-object-using-ngfor — Akber Iqbal, Sep 21 '19 at 10:32
ahhhhhhhhh what you're looking for is `@Input()` read more: https://angular.io/api/core/Input — Stavm, Sep 21 '19 at 10:36
yes, the components has many @Inputs and i need insert just object with keys and values to set themselves up — Lukáš Máška, Sep 21 '19 at 10:44
why don't you then pass the object to the child component and deal with it in the child? — AT82, Sep 21 '19 at 11:38
i can't edit child component. I have to use devextreme component without edit. Some ideas? thanks — Lukáš Máška, Sep 21 '19 at 11:52
okay, but you say you need to pass it like `` That is then exactly like I suggested. Am I missing something :D — AT82, Sep 21 '19 at 12:13
So i have to extends child component? because i cant edit it — Lukáš Máška, Sep 21 '19 at 12:17
Well I have to say that I now have no idea what you are trying to achieve here, since seems to me in your question that you want to pass the object, but you also say you don't want to? — AT82, Sep 21 '19 at 14:41
Its okay. I found a solution, but thank you for your help :) — Lukáš Máška, Sep 21 '19 at 17:07
I was looking on devextreme.com on tutorial and i found out that components has a method .option that allows set props from outside. — Lukáš Máška, Sep 22 '19 at 07:19

Angular dynamic properties into a component

0 Answers0