NG8003: ошибка NG8003: директива не найдена с помощью exportAs 'ngForm'

У меня проблема. В моем первом проекте angular 11 директива не найдена с помощью exportAs 'ngForm'. Я уже импортирую FormsModule и ReactiveFormsModule в app.module.ts, но все равно получаю эту ошибку. Вот мой код:

Это мой код product.component.html:

       <form #tambahBuku='ngForm' (ngSubmit)="onSubmit(addBook.value)">
          <div class="form-group">
            <label for="">Title Book :</label>
            <input type="text" class="form-control col-5" name=title placeholder="Title Book">
          </div>
          <div class="form-group">
            <label for="">Author :</label>
            <input type="text" class="form-control col-5" name=author placeholder="Book Author">
          </div>
          <div class="form-group">
            <label for="">Price :</label>
            <input type="text" class="form-control col-5" name=price placeholder="Book Price">             
          </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
            <button type="submit" class="btn btn-primary">Submit</button>
        </div>
    </form> 

это мой код product.component.ts

          import { Component, OnInit } from '@angular/core';



@Component({
  selector: 'app-product',
  templateUrl: './product.component.html',
  styleUrls: ['./product.component.css']
})
export class ProductComponent implements OnInit {

  ngOnInit(): void {

  }

  onSubmit(data){
    alert ("book "+data.title+'submited')
  }
}

и этот мой код app.module.ts

      import { BrowserModule } from '@angular/platform-browser';
...
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

// Material design
import { MaterialDesign } from './material/material.module';

@NgModule({
  declarations: [
    AppComponent,
    LoginComponent,
    RegisterComponent,
  ],
  imports: [
    BrowserModule,
    ...
    FormsModule,
    ReactiveFormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

2 ответа

Решение

Если ProductComponent объявлен в другом FeatureModule, а не непосредственно в AppModule, то этот модуль также должен будет импортировать FormsModule.

Похоже, ваш компонент продукта не объявлен в AppModule, куда вы импортировали необходимый FormsModule. Вам нужно импортировать этот FormsModule в модуль, в котором объявлен компонент вашего продукта.

Другие вопросы по тегам