selected index is reflecting to the all values in ngFor

Viewed 74

I have a requirement where have to select values from dropdown based on selection, if I select dropdown value in that dropdown I have to show a button. As of now am able to show the button and everything is working good but problem is in ngFor that button is reflecting to all the parent.

For reproducing the issue please look into the Stackblitz

addsymptom --->select dropdown --> add Option button will be displayed by selecting 'dropdown' value in the list. If I select 'scalar' in the dropdown add option should not be displayed.

For one item it is working fine if there are multiple add symptom the add option button is displaying in all.

Please refer this stackblitz

https://stackblitz.com/edit/angular-nbuzpt?file=src%2Fapp%2Fapp.component.html

https://stackblitz.com/edit/angular-nbuzpt?file=src%2Fapp%2Fapp.component.html

1 Answers

one solution would be to move your code in a separat component SymptomFormComponent this will make your code cleaner and you won't have this problem.

Something like this: <app-sympton-form *ngFor="let employee of symptoms().controls;"></app-sympton-fomr>

Related