Javascript 角度2路线-重定向到不同的应用程序

我正在用其他语言生成各种版本的应用程序。我使用的是AOT（提前）编译，因此我最终使用的是静态可部署站点，其结构如下所示：

dist -
  index.html -- entry file for the default (English language) app
  -fr
    index.html -- entry file for French language version
  -de
    index.html -- entry file for German language version

const baseUrl = window.location.origin;
window.location.href = baseUrl + '/' + requestedLanguage + '/index.html'; // e.g. requestedLanguage = 'fr'

目前，我可以使用下拉菜单在主语言网站之间切换，用户可以在下拉菜单中选择他们的首选语言，然后我使用普通JavaScript加载所需网站的主条目文件，如下所示：

dist -
  index.html -- entry file for the default (English language) app
  -fr
    index.html -- entry file for French language version
  -de
    index.html -- entry file for German language version

const baseUrl = window.location.origin;
window.location.href = baseUrl + '/' + requestedLanguage + '/index.html'; // e.g. requestedLanguage = 'fr'

这是可行的，因为请求实际的

index.html

文件意味着Angular不会将请求

href

解释为角度路由

不过，我希望发生的是，当用户输入的URL在路径中已经包含语言版本时，我希望该语言版本得到服务。我还希望保留URL路径，以便角度路由为请求的URL加载适当的组件

例如：

• 用户输入

  myDomain.com/fr/myPage

• 加载

  /fr/

  子目录下的应用程序，该应用程序中的角度路由加载

  MyPage

当前，如果我输入一个URL

myDomain.com/fr/myPage

，角度路由将尝试将所需的子文件夹

fr

解释为一个不存在的路由，因此我得到以下错误：

Error: Cannot match any routes. URL Segment: 'fr/instruments'

如何加载所需的应用程序和正确的组件？必须有一种方法来识别URL中的

fr

指的是不同的应用程序。也许我缺少一个构建配置或者什么？以下是我在

package.json

中构建法语版本的脚本：

"build:fr": "ng build --aot --output-path=dist/fr --base-href /fr/ --i18nFile=src/locale/messages.fr.xlf --i18nFormat=xlf --locale=fr",

---

对于英语、法语和丹麦语的不同路径，使用角度

路由器

概念

---

然后使用基于语言的路径。

只需使用组件而不是不同的单独应用程序，并使用以下示例 >

---

然后您可以通过URL直接访问页面

我可以通过如下方式配置.NET后端的管道来加载应用程序的不同语言版本，以便为每个不同语言的应用程序加载角度静态索引页面（代码中称为“SPA”）。它通过检查请求URL中的第一个子文件夹（例如，“/fr/”、“/de/”）是否有“index.html”页面来工作，如果该页面存在，则加载该页面：

Startup.cs

---

URL的其余部分（语言子文件夹后的部分）随后被解释为已加载应用程序（例如法语应用程序）内的路由。这意味着为应用程序加载了正确的组件（我不完全确定这部分是如何工作的-可能路径的其余部分会进入.NET请求管道的不同部分并传递到Angular应用程序？

谢谢，但是我需要一个Angular2解决方案而不是AngularJS你是说每种语言都有不同的组件？这使包裹的大小增加了三倍！