在Angular 6+中路由到静态HTML页面

Question

我有一个Angular项目，其中包含国家，地区和家庭三个组成部分。加载主页时，我有到HomeComponent的路由设置，该路由指向超链接。一切正常，并且表现得像单页（SPA）。现在，我想添加一个静态HTML页面并路由到它。我查看了Angular Route文档，但找不到解决方法。这是我的问题

1. 我可以在哪里放置静态HTML页面
2. 如何在app-routing.module.ts中路由这些文件

Github存储库：SpringTestingUI

Answer 1

在此基础上稍晚一些，正在使用Angular到静态html生成器，并偶然发现了这一点，并认为我会弹出。今天我实际上学会了如何执行此操作。

一个静态的html页面与另一个静态资产（例如样式表或图像）基本上没有什么不同，因此我们可以将这些页面完全相同。

在Angular asset configuration docs之后，我们可以创建html文件，并根据需要通过.angular-cli.json或angular.json在应用程序中引用它们。

我发现特别有用的一件事是当浏览器解析HTML页面时，能够为其手动配置参考路径。

例如，如果我们在目录src/static-pages/page1.html中有一个html，默认情况下，如果将该路径添加到angular.json的assets部分中，则该路径将位于路由{{1} }。 Angular允许您通过引用静态html或其他资产时在资产部分中提供一些额外的信息，来将此资产的解析路径更改为所需的任何路径。

例如：

http://hostname/static-pages/page1.html

执行此操作与创建仅呈现静态html的可视组件之间的主要区别在于，这允许Web搜寻器为该html页面建立索引。如果您只是想呈现静态的html文本，我将在Angular中创建一个额外的SPA组件，并像往常一样在// angular.json { ... "assets": [ // This page is routed /static-pages/page1.html "src/static-pages/page1.html", // This page is routed /home/page1.html { "glob": "page1.html", "input": "src/static-pages/", "output": "/home/" } ], ... } 中进行路由。