0

Fiz um ngFor para listar elementos select HTML e estou querendo capturar todos os dados selecionados por esse select... fiz da seguinte forma:

app.component.html

<form [formGroup]="secondFormGroup">
    <div *ngFor="let data of getSizeArray(dataHead); let i = index" class="example-box cursor-normal">
        <select formControlName="objetoMapeado">
            <option *ngFor="let d of displayedColumns" [ngValue]="d">
                {{d}}
            </option>
        </select>   
    </div>
</form>

app.component.ts

public secondFormGroup: FormGroup;
public displayedColumns: string[] = 
        ['Nota Fiscal','Fornecedor','Data da Compra','Valor da Compra','Numero de Parcela','Valor da Parcela','Tipo de Recebimento'];

constructor(private _formBuilder: FormBuilder) {}

ngOnInit() {
    this.secondFormGroup = this._formBuilder.group({
        objetoMapeado: ['', Validators.required]
    });
}

inserir a descrição da imagem aqui

O Problema que quando faço um console.log ele só exibe o valor do primeiro elemento e não de todos os elementos select HTML.

console.log(this.secondFormGroup.get('objetoMapeado').value);

1 Resposta 1

-1

Nesse caso vc tem que usar formArray inves do group

  this.formArray =  new FormArray(
  this.data.map(value=> new FormControl(value)) // os dados que seu array é baseado, é bem ruim chamar uma função no html como vc ta fazendo
 //passar o valor é opicional
);

no html

  <div *ngFor="let data of mappedArray; let i = index" class="example-box cursor-normal">
        <select [control]="formArray[i]">
            <option *ngFor="let d of displayedColumns" [ngValue]="d">
                {{d}}
            </option>
        </select>   
    </div>
4
  • Não entendi como funcionaria a implementação no application.components.ts 19/03/2020 às 16:48
  • Can't bind to 'control' since it isn't a known property of 'select'. <select [control]="formArray[i]"> 19/03/2020 às 16:57
  • então vc tem que fazer o map com base no array que vc ta fazendo o for 19/03/2020 às 20:41
  • Como ficaria ? Não tenho mta xp com Angular 19/03/2020 às 23:53

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .