ошибка NG8001 в angular даже после импорта общего модуля в другие модули и экспорта компонентов в общий модуль

Question

ошибка NG8001 в angular даже после импорта общего модуля в другие модули и экспорта компонентов в общий модуль

Ошибка, которую я получаю:

      Error: src/app/public/home/home.component.html:3:1 - error NG8001: 'app-footer' is not a known element:
1. If 'app-footer' is an Angular component, then verify that it is part of this module.
2. If 'app-footer' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the 
'@NgModule.schemas' of this component to suppress this message.

3 <app-footer></app-footer>
~~~~~~~~~~~~

src/app/public/home/home.component.ts:5:16
5   templateUrl: './home.component.html',
                 ~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component HomeComponent.

Я создал общий модуль. Внутри этого у меня есть компоненты верхнего и нижнего колонтитула. В общем модуле module.ts в разделе объявления и массива экспорта я упомянул компоненты верхнего и нижнего колонтитула. В общедоступном файле module.ts в массиве импорта упоминается общий модуль, но затем также возникает ошибка. Просто хотел узнать, общий модуль больше не поддерживается в angular 14?

Общий модуль.ts

      import { NgModule } from '@angular/core';
import { HeaderComponent } from './header/header.component';
import { FooterComponent } from './footer/footer.component';

@NgModule({
 declarations: [
 HeaderComponent,
 FooterComponent
],
imports: [
],
exports:[
 HeaderComponent,
 FooterComponent
]
})
export class SharedModule { }

Публичный модуль.ts

      import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { PublicRoutingModule } from './public-routing.module';
import { HomeComponent } from './home/home.component';
import { SharedModule } from '../shared/shared.module';
import { PublicComponent } from './public.component';

@NgModule({
declarations: [
 HomeComponent,
 PublicComponent
],
imports: [
 CommonModule,
 PublicRoutingModule,
 SharedModule
]
})
export class PublicModule { }

В домашнем компоненте.html, который находится под общедоступным модулем

      <p>home works!</p>
<app-footer></app-footer>

Самое главное в vscode никаких проблем не отображается, но я запускаю с помощью cmd, там отображаются ошибки

Компонент нижнего колонтитула.ts

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

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

constructor() { }

ngOnInit(): void {
}

}

Answer 1

Привет, я сделал здесь запрос на вытягивание, проверьте эту ссылку ниже https://github.com/ganeshapmb/Angular14/pull/1.

Answer 2

app.module.ts

      @NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    // Add here: PublicModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

public.module.ts

      @NgModule({
  declarations: [
    HomeComponent,
    PublicComponent
  ],
  imports: [
    CommonModule,
    PublicRoutingModule,
    SharedModule
  ]
})
export class PublicModule { }

Вы импортируете, но (ваш корневой модуль) не знает, что он существует, потому что вы не импортируете в . И потом, неважно, что вы импортировалиSharedModuleв которомHomeComponentимпортируется/экспортируется. Я бы очень рекомендовал улучшить структуру вашей папки/компонента/модуля, потому что это очень запутанно.

Но чтобы ответить на ваш вопрос: ИмпортPublicModuleвAppModuleи это будет работать.