Question

嗨，我试图在一个模块中声明所有组件，然后在app.module.ts的导入中添加该组件模块。

import { LandingPageComponent } from './landing-page/landing-page.component';
import { JobSeekerComponent } from './job-seeker/job-seeker.component';
import { RecruiterComponent } from './recruiter/recruiter.component';
import { PostJobsComponent } from './recruiter/post-jobs/post-jobs.component';
import { JobSeekerLayoutComponent } from './layout/job-seeker-layout/job-seeker-layout.component';
import { RecruiterLayoutComponent } from './layout/recruiter-layout/recruiter-layout.component';
import { RecruiterHeaderComponent } from './layout/recruiter-header/recruiter-header.component';
import { AutocompleteComponent } from './common/autocomplete/autocomplete.component';
import { NgModule } from '@angular/core';

@NgModule({
    imports: [
        LandingPageComponent,
        JobSeekerComponent,
        RecruiterComponent,
        PostJobsComponent,
        JobSeekerLayoutComponent,
        RecruiterLayoutComponent,
        RecruiterHeaderComponent,
        AutocompleteComponent
    ],
    exports: [
        LandingPageComponent,
        JobSeekerComponent,
        RecruiterComponent,
        PostJobsComponent,
        JobSeekerLayoutComponent,
        RecruiterLayoutComponent,
        RecruiterHeaderComponent,
        AutocompleteComponent
    ],
})
export class **ComponentsModule** { }

这是我创建的组件模块，然后我想在app.module.ts中对其进行初始化。这项工作会导致我尝试这样做时引发错误请添加@NgModule批注。在我的app.module.ts中。我做了这样的事情。

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { **ComponentsModule** } from './components';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MaterialModule } from './material';
import { HttpClientModule } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';

@NgModule({
  declarations: [
    AppComponent  
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    MaterialModule,
    AppRoutingModule,
    FormsModule,
    HttpClientModule,
    ReactiveFormsModule,
    **ComponentsModule**
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Answer 1

您应该宁愿importing中的declare它们而不是ComponentsModule

@NgModule({
    declarations: [           // declare components here
        LandingPageComponent,
        JobSeekerComponent,
        RecruiterComponent,
        PostJobsComponent,
        JobSeekerLayoutComponent,
        RecruiterLayoutComponent,
        RecruiterHeaderComponent,
        AutocompleteComponent
    ],
    exports: [
        LandingPageComponent,
        JobSeekerComponent,
        RecruiterComponent,
        PostJobsComponent,
        JobSeekerLayoutComponent,
        RecruiterLayoutComponent,
        RecruiterHeaderComponent,
        AutocompleteComponent
    ],
})

Angular 2+，有什么办法可以在模块中声明所有组件，然后导入app.module.ts？

1 个答案: