Angular: uncaught Ошибка: ошибки синтаксического анализа шаблона: нет директивы с «exportAs», установленным в «ngModel» - PullRequest
Новая
       7

Angular: uncaught Ошибка: ошибки синтаксического анализа шаблона: нет директивы с «exportAs», установленным в «ngModel»

0 голосов
/ 18 апреля 2020

Я использую Angular шаблонно-управляемые формы и получаю эту ошибку:

компилятор. js: 2175 Uncaught Ошибка: ошибки синтаксического анализа шаблона: нет директивы с «exportAs», установленной в «ngModel» "

my html:

<form #f="ngForm" (ngSubmit)="onSubmit(f)"> <input type="text" name="gender" #gender="ngModel"> </form>

app.module: 

import { HeaderModule } from 'src/app/components/header/header.module';
import { DemographicInfoComponent } from './pages/demographic-info/demographic-info.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserModule } from "@angular/platform-browser";
import { HttpClientModule } from "@angular/common/http";
import { NgModule } from "@angular/core";
import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import { EditMyProfileComponent } from "./pages/edit-my-profile/edit-my-profile.component";
import { StoreModule } from "@ngrx/store";
import { PurchaseComponent } from "./pages/purchase/purchase.component";
import { CharacterTypeInfoComponent } from "./pages/character-type-info/character-type-info.component";

@NgModule({
  declarations: [
    AppComponent,
    EditMyProfileComponent,
    PurchaseComponent,
    CharacterTypeInfoComponent,
    DemographicInfoComponent,
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    HeaderModule,
    FormsModule,
    ReactiveFormsModule,
    //StoreModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

Ответы [ 3 ]

1 голос
/ 18 апреля 2020

Вам не хватает [(ngModel)] в вашем <input> теге 

<form #f="ngForm" (ngSubmit)="onSubmit(f)">
  <input type="text" name="gender" #gender="ngModel" [(ngModel)]="gender" >
  </form>

в вашем component.ts объявите переменную gender 

class YourComponent {
  gender: string;
}
0 голосов
/ 19 апреля 2020

Мне нужно было добавить ngModel: 

<form #f="ngForm" (ngSubmit)="onSubmit(f)">
  <input type="text" name="gender" ->ngModel<- #gender="ngModel">
</form>
0 голосов
/ 18 апреля 2020

Эта ошибка обычно возникает, когда в самом шаблоне есть ошибка, я вижу, вы не закрыли <input>

 <input type="text" name="gender" #gender="ngModel" />
...