Based on @Günter Zöchbauer comments , first i changed myForm.controls[‘addresses’] to myForm.get(‘addresses’) in both html and typescript and then based on @yuruzi comment changed myForm.get(‘addresses’).controls to myForm.get(‘addresses’)[‘controls’] Its working fine now. Thanks @gunter & yuruzi
As a general (see Stackblitz here: https://stackblitz.com/edit/angular-gh2rjx): HTML <select [(ngModel)]=”selectedOption”> <option *ngFor=”let o of options”> {{o.name}} </option> </select> <button (click)=”print()”>Click me</button> <p>Selected option: {{ selectedOption }}</p> <p>Button output: {{ printedOption }}</p> Typescript export class AppComponent { selectedOption: string; printedOption: string; options = [ { name: “option1”, value: 1 }, { name: “option2”, value: 2 } … Read more
You can use formControlName only on directives which implement ControlValueAccessor. Implement the interface So, in order to do what you want, you have to create a component which implements ControlValueAccessor, which means implementing the following three functions: writeValue (tells Angular how to write value from model into view) registerOnChange (registers a handler function that is … Read more