Data binding issue in angular 6 select dropdowns

Question

I'm trying to get some data from user from user. My problem is when I try to change value in second dropdown it is changing value in all other rows as well which I'm not expecting to be. Lets say I have my view like below with all the second dropdown values set to 'c'.

When I change any value in second dropdown then it changes in all dropdowns like below

Please have a look at this link for better understanding. https://stackblitz.com/edit/angular-a27qru?file=src%2Fapp%2Fapp.component.ts.

Would appreciate if you can provide updated stackblitz link with fix :)

EDIT

I don't want to change the data structure, means rowData holds partner and partner contains group inside that. My condition is that by default it should select 'custom group' as value for first dropdown and some particular value(lets say 'c') from group for 'custom group' value of partner.

Answer 1

Fixed it by changing the data biding to one way binding instead of two way binding in html

See below link for fix reference.

https://stackblitz.com/edit/angular-siktgn?file=src/app/app.component.html