根据 Angular 中的条件加载 ngModule 及其组件

Question

我是 angular 的新手，我想知道是否可以根据 app.module 的条件加载和模块及其组件，或者最好的地方在哪里这样做。

基本上我想做这样的事情：

if(user.deparment === 'coms') {
  //Use the communications.module and its components
}

我附上了一些图片，以便你们可以看到应用程序的结构。如有必要，我可以添加代码而不是图片。

App.module 图片

Communications.module 图片

Answer 1

模块在您的应用程序开始时加载。您需要导入组件，并使用您需要的任何组件。您需要将组件注册到模块，以便可以访问您的组件。

Answer 2

您可以进行简单的三元检查以有条件地导入模块。像这样：

import { NgModule, Optional } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from './app.component';

@NgModule({}) class MyModule {}

// toggle and watch the console
const production = true;

@NgModule({
  imports:      [ BrowserModule, production ? MyModule : []],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule {
  constructor(@Optional() module: MyModule) {
    console.log(module);
  }
}

Live demo

根据 Angular 中的条件加载 ngModule 及其组件

Load ngModule and its components based on conditional in Angular

angular-module

angular