Question

我的app.module.ts中有这个：

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

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [
    BrowserModule, 
    IonicModule.forRoot(),
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule,
    SignalRModule.forRoot(createConfig)],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})

在我的tab1.page.ts中，我有以下内容：

import { FormsModule, FormGroup, FormControl, Validators } from '@angular/forms';

ngOnInit(): void {
    this.createForm();
    this.messageFromServerSubscription = this.cs.messageFromServer.subscribe(
      message => {
        this.message = message;
      }
    );
  }

createForm() {
this.form = new FormGroup({
  ipAddress: new FormControl(null, {
    updateOn: 'blur',
    validators: [Validators.required]
  })
});
}

，在我的tab1.page.html中，我像这样使用它：

<form [formGroup]="form">
        <ion-grid>
          <ion-row>
            <ion-col size-sm="6" offset-sm="3">
              <ion-item>
                <ion-label position="floating">Ip Address</ion-label>
                <ion-input 
                  type="text"
                ></ion-input>
              </ion-item>
            </ion-col>
          </ion-row>
        </ion-grid>
      </form>

我想我已经将所有内容直接导入了app.module和tab1.page.ts中。为什么仍然出现错误：>>无法绑定到“ formGroup”，因为它不是“ form”的已知属性。谢谢。

Answer 1

声明form: FormGroup

您还没有告诉文件它必须存在。

编辑：1

使用formbuilder import {Validators, FormBuilder, FormGroup } from '@angular/forms';

将其注入到您的构造函数中（不包含在引用的tab1.page.ts文件中吗？）

this.form = this.formBuilder.group({
    ipAddress: ['', validators.required]
});

然后在HTML中 IP地址

FormGroup无法在Angular 7上使用Ionic

1 个答案: