如何启用垫选择并通过单击其他垫选择来填充数据

时间:2020-04-09 15:06:03

标签: angular

我正在处理表单,我想使用另一个选择来启用选择(默认情况下禁用),并根据第一个值填充数据,为此,我尝试了:

            <div fxLayout="row" fxLayoutAlign="start center" fxFlex="1 0 auto">

                <mat-form-field appearance="outline" fxFlex="50">
                    <mat-label>Marque*</mat-label>
                    <mat-select formControlName="Marque" [(ngModel)]="selected" (ngModelChange)="onmarquechange()">
                        <mat-option *ngFor="let mar of MarqueListe" [value]="mar.Enum">{{mar.Name}}
                        </mat-option>
                    </mat-select>
                </mat-form-field>
                <mat-form-field appearance="outline" fxFlex="50">
                    <mat-label>Modèle*</mat-label>
                    <mat-select formControlName="Modele" [(ngModel)]="selected" [disabled]="selectmodele">
                        <mat-option *ngFor="let mod of ModelListe" [value]="mod.Enum">{{mod.Name}}
                        </mat-option>
                    </mat-select>
                </mat-form-field>
            </div>

我的组件:

  selectmodele = false;
  ModelListe =[];// contains select data (by default empty)
  ModelStockListe =[];//Contains Array of objects  
onmarquechange(){
    this.selectmodele = true;
    console.log(this.selectmodele);
    console.log(this.idSearchForm.get('Marque').value);//Acess to the first select value
    let valueofmarque = this.idSearchForm.get('Marque').value;
    console.log(this.ModelStockListe[valueofmarque]);
    this.ModelListe = this.ModelStockListe[valueofmarque]; 
  }

select onmarquechange()可以在进行填充选择更改后的数据填充模型选择上正常工作,但是我发现了两个问题:

1-当我更改选取值时,第二个选择仍然禁用 2-当我尝试选择模型选择选项中的一个选项时,我不知道为什么两个选择都将它们重置为值!

0 个答案:

没有答案