如何基于URL更改Angular6布局？

Question

我们将构建一个新的Angular6应用程序，该应用程序的每个URL都需要具有不同的布局。

所以：

• https://green.url.com =>绿色布局
• https://red.url.com =>红色布局

等

子域不是颜色，而是公司名称。

在当前应用程序中，我们根据第一次设置并在Angular中读取的会话（存储）来重写所选模板。 它可以工作，但似乎有点解决方法，而且不是失败证明。

实现此目标的最佳方法是什么？

Answer 1

您应该使用Angular的应用程序路由模块，这是最好的方法。

您可以在Angular的网页教程的这一部分中找到一个示例：https://angular.io/tutorial/toh-pt5

Answer 2

您要检查子域，并在此基础上需要更改背景色。您必须在应用程序中使用AuthGuard，以便您可以使用以下方法轻松提取subDomain：

({[x1]: window[x2], [x3]: window[x4]} = o)

然后，您可以返回subDomain并将其放入任何组件中，并且可以在构造函数中简单地对subDomain进行数学计算，如下所示：

fullURL = (window.location.host).split('.');
const subDomain = fullURL[0];