Question

我对angular＆打字稿还比较陌生。

我的想法是，将不同的主机名重定向到仅一个angular6项目，因为大多数内容都是相同的，只是语言和URL不同。

例如我在 app-routing.module.ts 中完成的操作：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import {enRoutes} from "lang/en/routes";
import {esRoutes} from "lang/es/routes";
import {frRoutes} from "lang/fr/routes";

let routes: Routes;

switch(window.location.hostname) {
  case 'foobar.es' : {
    routes = esRoutes;
  }
  case 'foobar.fr' : {
    routes = frRoutes;
  }
  default : {
    routes = enRoutes;
  }
}

@NgModule({
    exports: [ RouterModule ],
    imports: [ RouterModule.forRoot(routes) ],
})
export class AppRoutingModule {}

它的工作原理就像一种魅力，但是我现在面临的问题是每个hostName的路由都在它们的 main.js 中。现在，Route-Files确实很大，而且主机名也超过了3个，因此 main.js 变得非常大。

由于这些静态导入，无论调用哪个hostName，它都会加载所有路由。我已经尝试使用import（...）。then（...）进行延迟加载，但是它不起作用:(

有任何想法，如何解决？

Answer 1

您正在做的事情似乎很错误。

只有语言和网址不同

这应该是一个使用Angular国际化提供正确语言的应用程序。 Angular在这里提供不同语言时提供国际化的指南... https://angular.io/guide/i18n

对于不同的URL，是什么使您停止使用这样的简单查询：

[
  {
    "domain": "domainone.com",
    "url": "/url/one/"
  {,
  {
    "domain": "domaintwo.com",
    "url": "/url/two/"
  {
]

如果您确实需要遵循延迟加载路线（无论哪种方法都不错），则可以在此处找到延迟加载路线的Angular文档：

https://angular.io/guide/lazy-loading-ngmodules

如何在特定条件下使用导入？

1 个答案: