ค้นหาเว็บไซต์

angular - ngModel ทิ้งหน้าจอว่างเมื่อเรียกใช้งาน


ฉันกำลังพยายามเรียนรู้พื้นฐานของ Angular2 ดังนั้นฉันจึงพยายามสร้างการทดสอบบางอย่างแล้ว ฉันได้ดาวน์โหลด typescript และ angular/cli แล้ว

ฉันสามารถใช้การแทรกค่าตัวแปร (interpolation), การผูกคุณสมบัติ (property binding) เป็นต้น แต่เมื่อฉันพยายามใช้ การผูกข้อมูลสองทาง (two-way data-binding) แบบนั้น (ใน app.component.html สำหรับการทดสอบ):

<input type="text" [(ngModel)]="test.description">

และ ng server รีเฟรช สิ่งที่ฉันทำทั้งหมดหายไป และสิ่งที่ฉันเห็นก็มีเพียงหน้าจอว่างเปล่า

ฉันขอให้คำตอบง่าย ๆ เพราะฉันเป็นผู้เริ่มต้นในการใช้แองกูลาร์

แก้ไข: แม้หลังจากอัปเดต app.modules.ts แล้ว คอนโซลของฉันยังคงแสดงข้อผิดพลาดดังต่อไปนี้:

Uncaught Error: Template parse errors:
Can't bind to 'NgModel' since it isn't a known property of 'input'. ("
</p>

<input type="text" [ERROR ->][(NgModel)]="test.description" >`

คำตอบ #1

คุณต้องเจอข้อผิดพลาดในคอนโซล ในการใช้ ngModel ให้เพิ่มสิ่งนี้ในโมดูลของคุณ,

import { FormsModule, ReactiveFormsModule } from '@angular/forms';

@NgModule({
imports: [
         FormsModule      
]

ใช้ไวยากรณ์ที่ถูกต้อง ngModel

<input type="text" name="name" [(ngModel)]="test.description">

คำตอบ #2

คุณจำเป็นต้องใส่แอตทริบิวต์ "name" บน input เพื่อให้สามารถใช้งานกับ ngModel ได้

<input type="text" name="name" [(ngModel)]="test.description">

นี่คือ Plunker