Angular 4 * ngIf-動態顯示/隱藏模型變量更改

Question

這個問題已經被問過幾次了，但是其他示例似乎比我的簡單用例要復雜一些。

我試圖根據選擇框的值顯示/隱藏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() {
  }
}

在更改為false然后返回true之后，如何重新隱藏textarea ？

如果是相關的，我有一個從角度CLI生成的項目，這些是我的應用程序模塊中的導入： BrowserModule, FormsModule, CommonModule

謝謝！

Answer 1

嘗試使用[ngValue] ='true'代替value。