typescript 导入组件文件中的FormsModule和ReactiveFormsModule

mklgxw1f  于 2023-02-25  发布在  TypeScript
关注(0)|答案(1)|浏览(137)

我有一个React形式,我想把它放到boom-covers的生成组件中,我使用[formGroup]的属性:

<form name="boomCovers" method="post" id="bomCovers" (ngSubmit)="submitForm()" [formGroup]="boomCoversForm">
...
</form>

我得到了老栗子:

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

我知道我需要:

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

但是因为它是一个组件而不是一个页面,所以我没有boom-covers.module.ts文件来进行导入,只有:

boom-covers.component.html
boom-covers.component.scss
boom-covers.component.spec.ts
boom-covers.component.ts

我该怎么解决这个问题呢?
我试着把它放到app-module.ts中,但是似乎没有什么不同。我以前遇到过这个问题几次,我从来没有能够想出如何解决这个问题。

    • 应用程序模块. ts**
@NgModule({
  declarations: [AppComponent],
  imports: [ 
    FormsModule,
    ReactiveFormsModule,
    HttpClientModule,
  ],
  providers: [
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
    { provide: LocationStrategy, useClass: HashLocationStrategy },
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

有人有可行的解决办法吗?还是我在胡说八道?
基本上,如果我的组件没有附带.module.ts文件(默认情况下没有),我如何成功导入FormsModuleReactiveFormsModule
任何帮助或指导将不胜感激,因为我已经失去了工作时间的计数,我已经倾注在这没有什么显示它。

2q5ifsrm

2q5ifsrm1#

你有两个选择。
1.使用新的独立组件并将模块直接导入其中。
1.最简单的方法是将吊杆盖组件添加到app.module.ts中的"declarations"数组中。
例如:

@NgModule({
  declarations: [AppComponent, BoomCoversComponent],
  imports: [ 
    FormsModule,
    ReactiveFormsModule,
    HttpClientModule,
  ],
  providers: [
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
    { provide: LocationStrategy, useClass: HashLocationStrategy },
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

相关问题