Angular 10: Как экспортировать несколько компонентов в модуль

Question

Я использую Angular 10 версию. Есть несколько похожих вопросов, но они не решили мою проблему.

В моем проекте Angular я сделал два модуля с именами post и static. Модуль post имеет 10 компонентов . и я хочу использовать все эти компоненты в app.component. html.

что я пробовал

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

import { PostRoutingModule } from './post-routing.module';
import { ServiceofferedComponent } from './serviceoffered/serviceoffered.component';
import { FeaturesComponent } from './features/features.component';
import { WorksampleComponent } from './worksample/worksample.component';
import { PricingComponent } from './pricing/pricing.component';
import { LoginComponent } from './login/login.component';
import { SignupComponent } from './signup/signup.component';
import { ChooseserviceComponent } from './chooseservice/chooseservice.component';
import { DisplayresultComponent } from './displayresult/displayresult.component';
import { HeaderComponent } from './header/header.component';
import { BannerComponent } from './banner/banner.component';






@NgModule({
  declarations: [ ServiceofferedComponent, FeaturesComponent, WorksampleComponent, PricingComponent, LoginComponent, SignupComponent, ChooseserviceComponent, DisplayresultComponent, HeaderComponent, BannerComponent],
  imports: [
    CommonModule,
    PostRoutingModule
  ],
  exports:[HeaderComponent],
  exports:[BannerComponent],


  
  
})
export class PostModule { }

Я попробовал использовать exports:[BannerComponent],. первый экспорт в порядке. он не показывает никаких ошибок, но для второго он показывает ошибку. У меня есть еще много компонентов, как я буду экспортировать, и без экспорта я не могу использовать в app.component.html

У меня есть ошибка

   
    ERROR in src/app/post/post.module.ts:28:3 - error TS1117: An object literal cannot have multiple properties with the same name in strict mode.
    
    28   exports:[BannerComponent],
         ~~~~~~~
    src/app/post/post.module.ts:28:3 - error TS2300: Duplicate identifier 'exports'.
    
    28   exports:[BannerComponent],

Thankyou

Answer 1

Hy Rahul

  exports: [
        HeaderComponent,
        BannerComponent,
    ],

Записывайте только один раз для модуля, который нужно экспортировать. Надеюсь, это было полезно

Answer 2

Вам нужен только один атрибут экспорта и добавьте в этот массив все компоненты, которые необходимо экспортировать.

exports:[HeaderComponent, BannerComponent]

Answer 3

Чтобы экспортировать несколько компонентов, вы должны включить в массив exports

    ...
    @NgModule({
              declarations: [ ServiceofferedComponent, FeaturesComponent, WorksampleComponent, PricingComponent, LoginComponent, SignupComponent, ChooseserviceComponent, DisplayresultComponent, HeaderComponent, BannerComponent],
              imports: [
                CommonModule,
                PostRoutingModule
              ],
              exports:[HeaderComponent, BannerComponent],
        })
    ...

Вы должны думать о {} внутри @NgModule () как об объекте. У объекта не может быть двух свойств с одинаковым именем. Та же концепция применяется, когда мы думаем о object внутри @NgModule ().