angular js中多站点架构的多布局

Question

我们的angular应用程序中有一个多站点架构，每个站点的域的基本URL都会发生变化。对于每个网站，我们需要包含一个页眉和页脚，并且每个网站的页眉和页脚中的css和链接都会更改。

如何在angular js中动态包含与网站相关的头部html和css？

Answer 1

我用不同的方法解决了两次这个问题。

第一次：我根据正在加载的网站动态添加页眉和页脚组件，并为每个网站加载自定义主题

第二次：我们在laravel应用程序中移动了我们的angular应用程序，并使用了laravel中的动态页眉和页脚。因此从angular应用程序中完全删除了这一要求。这很管用。

Answer 2

当我正确理解您的问题时，您应该将页眉、页脚[..]导出为"私人的"；外部角度模块。因此，您可以在每个新项目中重复使用它。

例如

项目1

import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { BrowserModule } from '@angular/platform-browser';
...
import { YourHeaderModule } from './your-header.module';
@NgModule({
declarations: [ AppComponent ],
imports: [
BrowserAnimationsModule,
BrowserModule,
...
YourHeaderModule
],
providers: [],
bootstrap: [ AppComponent ]
})
export class AppModule { }

然后您可以像使用材料模块/组件一样使用它。