0

我有两个 md 选择：

<form (ngSubmit)="someAction(f)" #f="ngForm">
   <md-select
       #selectedHolidayType
        placeholder="Holiday type"
        name="holiday_type"
        [(ngModel)]="holiday_type"
    >
   <md-option *ngFor="let type of types" [value]="type.typeId">{{ type.typeName}}</md-option>
   </md-select>

<md-select
     *ngIf="selectedHolidayType === 19"
     placeholder="Some placeholder"
     name="option"
     [ngModel]="option"
>
      <md-option *ngFor="option of options" [value]="option.id">{{option.value}}</md-option>

</md-select>
</form>

仅当第一个 md-select 选定值设置为我想要的值时，我如何才能显示第二个 md-select，在这种情况下为 19。

或者也许：如何在 html 模板中获取第一个 md-select 的选定值？

我已经尝试过：

*ngIf="holiday_type === 19"
*ngIf="selectedHolidayType.selected === 19"
*ngIf="selectedHolidayType.selected.value === 19"

但这些都不起作用。

谢谢你的帮助！

4

2 回答 2

0

Ok, i found the answer: 

 <md-select
       #selectedHolidayType
        placeholder="Holiday type"
        name="holiday_type"
        [(ngModel)]="holiday_type"
    >
   <md-option *ngFor="let type of types" [value]="type.typeId">{{ type.typeName}}
   </md-option>
</md-select>

<div *ngIf="holiday_type > 0">

    <md-select
     *ngIf="holiday_type == 19"
     placeholder="Some placeholder"
     name="option"
     [ngModel]="option"
    >
      <md-option *ngFor="option of options" [value]="option.id">{{option.value}}
    </md-option>

  </md-select>

</div>

No idea why but if i wrap md-select in a div it works!

I would realy apreciate if someone could explain that behavior :)

于 2017-09-29T13:22:14.233 回答
0

我不知道为什么当你尝试它时它不起作用*ngIf="holiday_type === 19"。

这是一个像这样工作的示例，

<form>
  <md-select placeholder="Holiday type"
      name="holiday_type"
      [(ngModel)]="holiday_type">
    <md-option *ngFor="let type of types" [value]="type.typeId">{{ type.typeName }}</md-option>
  </md-select>

  <!-- Only show when 19 is selected -->
  <md-select *ngIf="holiday_type === 19"
      placeholder="Some placeholder"
      name="option"
      [(ngModel)]="option">
    <md-option *ngFor="let option of options" [value]="option.id">{{ option.value }}</md-option>
  </md-select>

</form>
于 2017-09-29T13:44:42.803 回答