AngularJS，輸入文本框甚至沒有顯示

Question

我只是在運行一些基本的默認鍋爐板代碼，我編輯這個文件：

app.component.html

<input type="text" [(ngModel)]="name"> 
    <p> {{name}} </p> 

app.component。 ts

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

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    name = ''; 
} 

但是，這從字面上什麼都不做。只有一個空白頁面。我究竟做錯了什麼？這似乎很基本

Answer 1

由於ngModel指令包含在FormsModule中，所以您必須在AppModule的imports元數據選項中導入並添加該模塊。

代碼

import { NgModule }  from '@angular/core'; 
import { FormsModule }  from '@angular/forms'; //<-- FormsModule import 
import { BrowserModule } from '@angular/platform-browser'; 
import { AppComponent } from './app.component'; 

@NgModule({ 
    imports:  [ BrowserModule, FormsModule ], //<-- added FormsModule to imports option 
    declarations: [ AppComponent ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { } 

Demo Here