Angular-构建后未处理的导航错误

Question

我通过以下命令构建了具有2条路线的简单角度应用程序：

ng build --aot --prod --base-href ./

然后我打开位于index.html文件夹中的dist文件，该应用程序运行，但是路由不起作用，并且在控制台上收到以下警告：

希望很好地解释了我的问题。预先感谢。

Answer 1

使用Angular路由引擎将迫使您将应用托管在某些服务器（例如IIS，NodeJS等）中

无需路由即可运行的简单无角度应用程序，而无需将其托管在服务器上。

来自Angular docs：

  

Angular应用程序非常适合与简单的静态HTML服务器一起使用。您不需要服务器端引擎来动态编写应用程序页面，因为Angular在客户端进行此操作。

     

如果该应用程序使用Angular路由器，则必须配置服务器，以在系统询问该应用程序没有的文件时返回该应用程序的宿主页（index.html）。

Answer 2

app/module.ts：

import { LocationStrategy, HashLocationStrategy} from '@angular/common';


@NgModule({
 ...
 ],
 providers: [{ provide: LocationStrategy, useClass: HashLocationStrategy }]
})

Answer 3

如果您使用哈希路由并按如下所示在index.html中定义基本href，则角路由有效。

<base href="#">

Answer 4

就我而言，我会得到：

  

未处理的导航错误：main.af3eff424835a3d5642f.js：1

因为我的基本网址设置为https：//

<base href="https://example.com" />

但是我正在通过http：//

加载网站

http://example.com

解决方案是使用https：// URL或更改基本URL以允许通过http访问。