Angular material : 如何调整两个输入垫之间的参考-select

Question

我在 Angular 6 个应用下工作：

我有两个 mat-select 输入，我想在它们之间实现一个参考，顺便说一句，如果我的 selected 选项在我的 First select == 值'AAA' 第二个垫子-select应该被隐藏

第一垫-Select->'AAA'
第二垫-Select->隐藏

我试过这样的事情:

       <div class="form-group">
          <label class="col justify-content-start">Mode de chiffrement</label>
          <mat-form-field class="col" >
            <mat-select placeholder="Selectionner le mode de chiffrement" formControlName="modeChiffrement" #FirstSelect>
              <mat-option *ngFor="let modeCh of modeChiffrementData" [value]="modeCh.value">
                {{modeCh.viewValue}}
              </mat-option>
            </mat-select>
          </mat-form-field>
          </div>

          <div class="form-group" *ngIf="!(FirstSelect== 'AAA')">
            <label class="col justify-content-start">fichiers clés</label>
            <!--<input type="text" formControlName="modeTransfert" class="col form-control"/>-->
            <mat-form-field class="col" >
              <mat-select placeholder="Selectionner fichier" formControlName="fichiersCles">
                <mat-option *ngFor="let modeCh of modeChiffrementData" [value]="modeCh.value">
                  {{modeCh.viewValue}}
                </mat-option>
              </mat-select>
            </mat-form-field>
          </div>

但这不起作用

想法 ?

Answer 1

您使用的引用实际上是一个Material元素（放在mat-select上）。

因为该元素 implements the ControlValueAccessor 界面，您可以像 HTMLInputElement 一样使用它。

这意味着您应该使用您的条件

*ngIf="!(FirstSelect.value == 'AAA')"

第二种解决方案，因为你使用的是响应式表单实例，所以你可以简单地使用

*ngIf="!(myForm.get('modeChiffrement').value == 'AAA')"

Angular material : 如何调整两个输入垫之间的参考-select

Angular material : how to adjust reference betwen two input mat-select

typescript

angular-ng-if

angular-material

angular-material2

angular