Angular 添加懒散负载-';垫图标';不是已知元素

Angular 添加懒散负载-';垫图标';不是已知元素,angular,lazy-loading,Angular,Lazy Loading,我有现有的应用程序,现在我想添加延迟加载 我的应用程序结构是这样的 app core | |-shared.module.ts | |-core.module.ts | |--home | | | |-home.component.ts | |-home.component.html | |-home.component.css | |--users | | | |-users.component.ts |

我有现有的应用程序,现在我想添加延迟加载

我的应用程序结构是这样的

app
 core
 |  |-shared.module.ts
 |  |-core.module.ts
 |
 |--home
 |     |
 |     |-home.component.ts
 |     |-home.component.html
 |     |-home.component.css
 |
 |--users
 |     |
 |     |-users.component.ts
 |     |-users.component.html
 |     |-users.component.css 
 |
 app.component.ts
 app.component.html
 app.component.css
 app.module.ts
 app-routing.module.ts
import { BrowserModule } from "@angular/platform-browser";
import { NgModule, ModuleWithProviders } from "@angular/core";
import { CoreModule } from "../../../core/core-module";
import { SharedModule } from "../../../core/shared.app.module.dependency";

 // views
 import { AppComponent } from "./app.component";
 import { AppRoutingModule } from "./app-routing.module";

 import { RouterModule } from "@angular/router";
 import { HomeModule } from "./home/home.module";
 import { UsersModule } from "./users/users.module";

 @NgModule({
    declarations: [AppComponent],
    imports: [
        BrowserModule,
        RouterModule,
        AppRoutingModule,
        SharedModule,
        CoreModule,
        HomeModule,
        UsersModule
    providers: [],
    bootstrap: [AppComponent]
    })
    export class AdminModule {}
现在,我在每个组件中添加了
home.module.ts和home routing.module.ts
users.module.ts和home routing.module.ts

同样从我的
app.module
中,我将所有导入移动到
shared.module
core.module

现在,在我的
应用程序中,模块
如下所示

app
 core
 |  |-shared.module.ts
 |  |-core.module.ts
 |
 |--home
 |     |
 |     |-home.component.ts
 |     |-home.component.html
 |     |-home.component.css
 |
 |--users
 |     |
 |     |-users.component.ts
 |     |-users.component.html
 |     |-users.component.css 
 |
 app.component.ts
 app.component.html
 app.component.css
 app.module.ts
 app-routing.module.ts
import { BrowserModule } from "@angular/platform-browser";
import { NgModule, ModuleWithProviders } from "@angular/core";
import { CoreModule } from "../../../core/core-module";
import { SharedModule } from "../../../core/shared.app.module.dependency";

 // views
 import { AppComponent } from "./app.component";
 import { AppRoutingModule } from "./app-routing.module";

 import { RouterModule } from "@angular/router";
 import { HomeModule } from "./home/home.module";
 import { UsersModule } from "./users/users.module";

 @NgModule({
    declarations: [AppComponent],
    imports: [
        BrowserModule,
        RouterModule,
        AppRoutingModule,
        SharedModule,
        CoreModule,
        HomeModule,
        UsersModule
    providers: [],
    bootstrap: [AppComponent]
    })
    export class AdminModule {}
core.module
中,我设置了这个

import { NgModule, ModuleWithProviders, APP_INITIALIZER } from 
"@angular/core";
import { CommonModule } from "@angular/common";
import { HttpClientModule, HttpClient, HTTP_INTERCEPTORS } from 
"@angular/common/http";
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
import { BrowserAnimationsModule } from "@angular/platform- 
browser/animations";
import { BrowserModule } from "@angular/platform-browser";

@NgModule({
imports: [CommonModule, BrowserModule, BrowserAnimationsModule, 
HttpClientModule, FormsModule, ReactiveFormsModule, KeycloakAngularModule],
declarations: [],
exports: [BrowserModule]
})
export class CoreModule {}
shared.module
中,我将我需要的所有内容导入到我的应用程序中,比如角度材质(我将其设置为导入和导出)以及CommonModule、FormsModule、ReactiveFormsModule等

现在,在我的“home.module”中,我导入了一个共享模块和组件

import { NgModule } from "@angular/core";
import { CommonModule } from "@angular/common";
import { HomeComponent } from "./home.component";
import { SharedModule } from "projects/core/shared.app.module.dependency";
import { RouterModule } from "@angular/router";
import { HomeRoutingModule } from "./home-routing.module";

@NgModule({
   declarations: [HomeComponent],
   imports: [CommonModule, RouterModule, HomeRoutingModule, SharedModule]
   })
 export class HomeModule {}
但我总是在控制台中出错

在共享模块中,我导入所有材质依赖项。在此之前,一切正常

 A11yModule,
 CdkStepperModule,
 CdkTableModule,
 CdkTreeModule,
 DragDropModule,
 MatAutocompleteModule,
 MatBadgeModule,
 MatBottomSheetModule,
 MatButtonModule,
 MatButtonToggleModule,
 MatCardModule,
 MatCheckboxModule,
 MatChipsModule,
 MatStepperModule,
 MatDatepickerModule,
 MatDialogModule,
 MatDividerModule,
 MatExpansionModule,
 MatGridListModule,
 MatIconModule,
 MatInputModule,
 MatListModule,
 MatMenuModule,
 MatNativeDateModule,
 MatPaginatorModule,
 MatProgressBarModule,
 MatProgressSpinnerModule,
 MatRadioModule,
 MatRippleModule,
 MatSelectModule,
 MatSidenavModule,
 MatSliderModule,
 MatSlideToggleModule,
 MatSnackBarModule,
 MatSortModule,
 MatTableModule,
 MatTabsModule,
 MatToolbarModule,
 MatTooltipModule,
 MatTreeModule,
 PortalModule,
 ScrollingModule

你是否在你的
应用程序模块中导入了你的
共享模块
?你是否在共享模块中导出了:[MatIconModule]
?@YashRami是的我导入了所有内容,你可以在我的帖子中看到我在question@KrishnaRathore是的,我导出所有mat模块MATIComponent呢?它被很好地导出,或者它的选择器可能是错误的!你是否在你的
应用程序模块中导入了你的
共享模块
?你是否在共享模块中导出了:[MatIconModule]
?@YashRami是的我导入了所有内容,你可以在我的帖子中看到我在question@KrishnaRathore是的,我导出所有mat模块MATIComponent呢?它被很好地导出,或者它的选择器可能是错误的!