если x является компонентом Angular, тогда проверьте его часть этого модуля

Question

Я создал приложение Angular. Я поместил селектор компонента навигации в app.component. html, который является частью app.module, и получаю следующую ошибку:

ERROR in src/app/app.component.html:1:1 - error NG8001: 'app-nav' is not a known element:
1. If 'app-nav' is an Angular component, then verify that it is part of this module.

app-nav является селектором navcomponent который принадлежит общему модулю. Общий модуль импортируется в app.module.

Так почему же не распознается навигация приложения?

NavComponent

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

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

  constructor() { }

  ngOnInit(): void {
  }

}

Общий модуль

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { NavComponent } from './nav/nav.component';



@NgModule({
  declarations: [NavComponent],
  imports: [
    CommonModule
  ]
})
export class SharedModule { }

Модуль приложения

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { SharedModule } from './shared/shared.module';
import { AppComponent } from './app.component';

import { HttpClientModule } from '@angular/common/http';
import { OrderModule } from './modules/order/order.module';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    OrderModule,
    SharedModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component. html

<app-nav> </app-nav>

Answer 1

Поскольку общий модуль не экспортирует компонент. Добавьте exports: [NavComponent] в свой общий модуль. Когда вы добавляете компонент или модуль в общий модуль, не забудьте добавить его в массив exports.