2017-07-16 64 views
1

這已被問了幾次,但其他示例似乎比我的簡單用例更復雜一點。Angular 4 * ngIf - 動態顯示/隱藏模型變量變化

我試圖根據選擇框的值顯示/隱藏textarea

它在加載時按預期工作,但在更改來回選擇的值時不起作用。

正如我所說的,模型變量的默認值是false,並且textarea在加載時隱藏(根據需要)。

下面是HTML:

<div> 
    <select id="isFunded" [(ngModel)]="isFunded" name="isFundedSelect"> 
     <option value="false" selected>No</option> 
     <option value="true">Yes</option> 
    </select> 
</div> 
<div> 
    <textarea class="form-control" rows="3" placeholder="Notes..." *ngIf="isFunded"></textarea> 
</div> 
<p>Is funded? {{isFunded}}</p> <!-- this updates when the select value changes --> 

這裏是我的組件的整個身體:

import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'app-second-form', 
    templateUrl: './second-form.component.html', 
    styleUrls: ['./second-form.component.sass'] 
}) 
export class SecondFormComponent implements OnInit { 
    isFunded = false; 
    constructor() { } 
    ngOnInit() { 
    } 
} 

我怎樣才能重新隱藏textarea更改爲false再回到true後?

如果是培訓相關,我有角CLI生成的項目,這些都是在我的應用程序模塊進口:BrowserModule, FormsModule, CommonModule

謝謝!

回答

4

嘗試使用[ngValue] ='true'而不是值。

+0

這樣做。謝謝! – Mac