如何在 angular material select 下拉列表中的值的 selection 上显示按钮

Question

一旦我 select 来自下拉字段的下拉值，我想加载另一个 div 中的一个部分 ngif 会帮助我做到这一点，但我怎么能将其添加为显示该部分的条件任何下拉菜单 selected 都应打开该部分稍后会将其自定义为 div 中的不同其他部分，以根据 select 不同下拉值的离子相应地加载

Answer 1

这可以通过使用 selectionchange 事件 emmiter 函数来解决，只要您 select 从下拉列表中选择一个值，您就可以调用 eventemmiter 函数。请看下面的代码：

Html代码：

<div>
    <mat-select placeholder="Options" 
    (selectionChange)="onSelecetionChange($event.value)">
        <mat-option value="individual ">Individual </mat-option>
        <mat-option value="business">Business</mat-option>
    </mat-select>
</div>

<div *ngIf="individual">
   Individual Div
</div>
<div *ngIf="business">
   Business Div
</div>

我的代码：

individual: boolean;
business: boolean;

onSelecetionChange( value: string ) {
if( value === 'individual') {
  // You can add some service call or customize your data from here
  this.individual = true;
}
if( value === 'business') {
  // You can add some service call or customize your data from here
  this.business = true;
}

}

如何在 angular material select 下拉列表中的值的 selection 上显示按钮

How to show button on selection of a value from the angular material select dropdown

select

angular-reactive-forms

angular6

angular-material-6