Angular2 在选择更改时显示元素

Question

使用Angular 2打字稿。如果选择了新选项，我只想显示我的保存按钮。然后我想在单击后隐藏保存按钮。我怎样才能做到这一点？不太确定如何处理这个问题。代码如下：

HTML

<select>
   <option *ngFor="let option of optionArray" [value]="option">{{option}}</option>
</select>

<span class="input-group-btn">
   <button class="btn btn-primary save-button" type="submit">Save</button>
</span>

Answer 1

您可以在这种情况下使用 *ngIf，

<select [(ngModel)]="selected">
   <option *ngFor="let option of optionArray" [value]="option">{{option}}</option>
</select>
<span *ngIf="selected" class="input-group-btn">
       <button class="btn btn-primary save-button" type="submit">Save</button>
</span>

Answer 2

您可以将 ngModel 放在 select 字段上并根据 select 值您可以 show/hide 提交按钮。

<select [(ngModel)]="selectedValue">
   <option *ngFor="let option of optionArray" [value]="option">{{option}}</option>
</select>

<span class="input-group-btn" *ngIf="selectedValue">
   <button class="btn btn-primary save-button" type="submit">Save</button>
</span>

Note: You have to import and include FormsModule inside your AppModule NgModule.

Angular2 在选择更改时显示元素

Angular2 show element on change of selection

typescript

angular2-template

angular