Как импортировать компонент в ваш второй module.ts?

Question

У меня есть креативный шаблон Tim - Aragon. и в этом шаблоне у меня есть app.module.ts и также admin-layout.module.ts У меня возникают проблемы, когда я пытаюсь импортировать сторонний компонент на новую страницу, например - угловые формы материала.

Я импортирую все модули для формы в admin-layout.module.ts и прошёл HTML-код формы в html-файле моей новой страницы. но сайт раздавлен и не загружен. я должен импортировать также в app.module? какие шаги?

//this is the app.module

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { RouterModule } from '@angular/router';

import { AppComponent } from './app.component';
import { AdminLayoutComponent } from './layouts/admin-layout/admin-layout.component';
import { AuthLayoutComponent } from './layouts/auth-layout/auth-layout.component';

import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

import { AppRoutingModule } from './app.routing';
import { ComponentsModule } from './components/components.module';







@NgModule({
  imports: [
    BrowserAnimationsModule,
    FormsModule,
    HttpClientModule,
    ComponentsModule,
    NgbModule,
    RouterModule,
    AppRoutingModule
  ],
  declarations: [
    AppComponent,
    AdminLayoutComponent,
    AuthLayoutComponent,
    
    
   
  
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

//this is the admin-layout.module.ts

import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';import { RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

import { ClipboardModule } from 'ngx-clipboard';

import { AdminLayoutRoutes } from './admin-layout.routing';
import { DashboardComponent } from '../../pages/dashboard/dashboard.component';
import { IconsComponent } from '../../pages/icons/icons.component';
import { MapsComponent } from '../../pages/maps/maps.component';
import { UserProfileComponent } from '../../pages/user-profile/user-profile.component';
import { TablesComponent } from '../../pages/tables/tables.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { TeamsComponent } from '../../pages/teams/teams.component';
import { CoachesComponent } from '../../pages/coaches/coaches.component';
import { CourtsComponent } from '../../pages/courts/courts.component';


// import { ToastrModule } from 'ngx-toastr';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    RouterModule.forChild(AdminLayoutRoutes),
    FormsModule,ReactiveFormsModule,
    HttpClientModule,
    NgbModule,
    ClipboardModule
  ],
  declarations: [
    DashboardComponent,
    TeamsComponent,
    CourtsComponent,
    CoachesComponent,
    UserProfileComponent,
    TablesComponent,
    IconsComponent,
    MapsComponent
  ]
})

export class AdminLayoutModule {}

Я надеюсь решить эту проблему и импортировать компонент на новых страницах моего сайта