Angular 2 RC.5无法绑定到'formGroup'，因为它不是'form'的已知属性 [英] Angular 2 RC.5 Can't bind to 'formGroup' since it isn't a known property of 'form'

问题描述

我有错误

 无法绑定到'formGroup'，因为它不是'form的已知属性'
  

将项目更新到angular2 RC.5之后

app.module.ts：

  @NgModule（{
声明：[
 AppComponent $ 
 BrowserModule 
 DeprecatedFormsModule 
 HttpModule 
 TranslateModule.forRoot（
提供：TranslateLoader，
 useFactory：（http：Http）=>新TranslateStaticLoader（http，'/ assets / i18n'，'.json'），
 deps：[
}），
 ConfigurationDevicesModule ，
 ConfigurationEditModule，
 ControlModule，
 ResourceEditModule，
 UniWebControlInfoModule，
 routing 
]，
 bootstrap：[AppComponent] 
} ）
 
导出类AppModule {
 
} 
  

myComponent.module.ts

  @NgModule（{ 
声明：[
 ConfigurationDevicesComponent 
]，
进口：[
 BrowserModule，
 TranslateModule 
]，
 exports：[
 ConfigurationDevicesComponent 
] 
}）
 
导出类ConfigurationDevicesModule {
 
} 
   
 
 $ b 
 template html例子：
 
 
 < form [formGroup] = selectBackground > 
< div * ngIf =backgroundsclass =form-group> 
< h5> {{'CONFIGURATION_DEVICES.ALL_BACKGROUNDS'| translate}}< / h5> 
< select formControlName =selectBackgroundId> 
< option * ngFor =让背景背景[value] =background.id> {{'CONFIGURATION_DEVICES.ID'|翻译}} {{background.id}} {{'CONFIGURATION_DEVICES.NAME'| translate}} {{background.name}}< / option> 
< / select> 
< / div> 
< / form> 
  
在angular 2 RC4中，formGroup运行良好。
 
 
 
我试图导入DeprecatedFormsModule和DFormsModule，问题是一样的。在Angular的官方文档中，我找不到任何关于formGroup的提及，或者再次改变了构建表单的方式？       update   $ b 
  ReactiveFormsModule 需要添加到 imports  
 $ $ p $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ ;< === 
 ... 
}）
  

原始

使用 ReactiveFormsModule 而不是 DeprecatedFormsModule ngModel 和 formControlName 来使用



c>您需要导入 FormsModule 和 ReactiveFormsModule

I have an error

Can't bind to 'formGroup' since it isn't a known property of 'form'

after update project to angular2 RC.5

app.module.ts:

@NgModule({
declarations: [
    AppComponent
],
imports: [
    BrowserModule,
    DeprecatedFormsModule,
    HttpModule,
    TranslateModule.forRoot({
      provide: TranslateLoader,
      useFactory: (http: Http) => new TranslateStaticLoader(http, '/assets/i18n', '.json'),
      deps: [Http]
    }),
    ConfigurationDevicesModule,
    ConfigurationEditModule,
    ControlModule,
    ResourceEditModule,
    UniWebControlInfoModule,
    routing
],
bootstrap: [ AppComponent ]
})

export class AppModule {

}

myComponent.module.ts

@NgModule({
declarations: [
    ConfigurationDevicesComponent
],
imports: [
    BrowserModule,
    TranslateModule
],
exports: [
    ConfigurationDevicesComponent
]
})

export class ConfigurationDevicesModule {

}

template html example:

<form [formGroup]="selectBackground">
                        <div *ngIf="backgrounds" class="form-group">
                            <h5>{{ 'CONFIGURATION_DEVICES.ALL_BACKGROUNDS' | translate }}</h5>
                            <select formControlName="selectBackgroundId">
                                <option *ngFor="let background of backgrounds" [value]="background.id">{{ 'CONFIGURATION_DEVICES.ID' | translate }} {{ background.id }} {{ 'CONFIGURATION_DEVICES.NAME' | translate }} {{ background.name }}</option>    
                            </select>
                        </div>
                    </form>

In angular 2 RC4, formGroup worked fine.

I tried to import both DeprecatedFormsModule and DFormsModule , the problem is the same . In official documentation Angular now I can not find any mention about formGroup or again changed the way of building forms?

解决方案

update

ReactiveFormsModule needs to be added to imports

 @NgModule({
   imports: [BrowserModule, FormsModule, ReactiveFormsModule], // <<<===
   ...
 })

original

Use ReactiveFormsModule instead of DeprecatedFormsModule.

To be able to use ngModel with formControlName you need to import FormsModule and ReactiveFormsModule

这篇关于Angular 2 RC.5无法绑定到'formGroup'，因为它不是'form'的已知属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！