Angular: Link multiple fields to a reactive form

Question

Angular: Link multiple fields to a reactive form

Navigation

#1 by (0 votes)

1

The problem is that I have multiple select multiple and when I select some options from a select they are added to the ReactiveForm correctly, but when I select some other select option they are overwritten, I need them not to override. They are automatically generated.

this.form = this.builder.group({
  id: [],
  permissoes: ([{}]),
}, {});

<div class="col-md-6">                                 
    <select class="form-control" formControlName="permissoes" [compareWith]="compareFn" multiple>
        <option *ngFor="let permissao of permissoes" [ngValue]="permissao">{{permissao.nome}}</option>
    </select>
</div>

All selects are equal, is it possible to merge all selects in this permissions array?

html-select angular

asked by anonymous 31.08.2018 / 15:26

1 answer

Oracle where case Registering new date in MySQL

score 0 · Answer 1

For each select or input you have, you have to add a corresponding line when creating your form. And through the formControlName field vc maps each select / input to its respective control.

this.form = this.builder.group({
  id: [],
  permissoes: ([{}]),
  outroSelect: ([{}]),
});

<div class="col-md-6">                                 
    <select class="form-control" formControlName="permissoes" [compareWith]="compareFn" multiple>
        <option *ngFor="let permissao of permissoes" [ngValue]="permissao">{{permissao.nome}}</option>
    </select>
</div>

 <div class="col-md-6">                                 
        <select class="form-control" formControlName="outroSelect" [compareWith]="compareFn" multiple>
            <option *ngFor="let outraCoisa of outroSelect" [ngValue]="outraCoisa ">{{outraCoisa .nome}}</option>
        </select>
  </div>