I have 2 instances of the same angular element in the same page:
<my-widget id="myWidget" isfullscreen="false"></my-widget>
<my-widget id="myWidget" isfullscreen="true"></my-widget>
And in the component my-widget I have another component:
<my-dropdown *ngIf="isfullscreen === 'true'" #Dropdown1 [items]="myItems" [afterChange]="afterSelectionChanged1"></my-dropdown>
<my-dropdown *ngIf="isfullscreen === 'false'" #Dropdown2 [items]="myItems" [afterChange]="afterSelectionChanged2"></my-dropdown>
When the 2 widgets are shown, and I change something in the dropdown of the second widget, the first widget is affected instead of the second. Why does this happen? How could I fix this?
