在启动Angular应用程序时，即使组件没有显示，我也会出现以下错误。
我必须注释掉，这样我的应用程序才能正常工作。
zone.js:461 Unhandled Promise rejection: Template parse errors:
Can't bind to 'ngModel' since it isn't a known property of 'input'. ("
<div>
<label>Created:</label>
<input type="text" [ERROR ->][(ngModel)]="test" placeholder="foo" />
</div>
</div>"): InterventionDetails@4:28 ; Zone: <root> ; Task: Promise.then ; Value:
我在看英雄plunker，但我看不出和我的代码有什么区别。
下面是组件文件:
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { Intervention } from '../../model/intervention';
@Component({
selector: 'intervention-details',
templateUrl: 'app/intervention/details/intervention.details.html',
styleUrls: ['app/intervention/details/intervention.details.css']
})
export class InterventionDetails
{
@Input() intervention: Intervention;
public test : string = "toto";
}
是的。就是这样，在app.module.ts中，我刚刚补充了:
import { FormsModule } from '@angular/forms';
[...]
@NgModule({
imports: [
[...]
FormsModule
],
[...]
})
为了能够对表单输入使用双向数据绑定，您需要在angular模块中导入formsmodule包。 有关更多信息，请参阅Angular 2官方教程和表单的官方文档
用于在Angular 2，4&中使用[(ngModel)]； 5+，您需要从Angular窗体导入FormsModule.。。
在GitHub的Angular repo中的forms下也是这样的:
angular/packages/forms/src/directives/ng_model.ts
对于AngularJs开发人员来说，这可能不是一个很愉快的事情，因为您以前可以随时随地使用ng-model，但是当AngularJs尝试将模块分开来使用您当时想要使用的任何模块时，ngModel现在在FormsModule中。
另外，如果您正在使用ReactiveFormsModule，也需要导入它。
所以只需查找app.module.ts，并确保已将formsmodule导入。。。
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms'; //<<<< import it here
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule, FormsModule //<<<< and here
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
这也是FormsModule中Angular4NGModel的当前开始注释:
/**
* `ngModel` forces an additional change detection run when its inputs change:
* E.g.:
* ```
* <div>{{myModel.valid}}</div>
* <input [(ngModel)]="myValue" #myModel="ngModel">
* ```
* I.e. `ngModel` can export itself on the element and then be used in the template.
* Normally, this would result in expressions before the `input` that use the exported directive
* to have and old value as they have been
* dirty checked before. As this is a very common case for `ngModel`, we added this second change
* detection run.
*
* Notes:
* - this is just one extra run no matter how many `ngModel` have been changed.
* - this is a general problem when using `exportAs` for directives!
*/
如果您希望使用您的输入，而不是在表单中使用，您可以将其与NGModelOptions一起使用，并使standalone为true.。。
[ngModelOptions]="{standalone: true}"
有关更多信息，请查看此处角截面中的ng_model
