Angular和node js SPA-当我在组件之间导航时，幕后会发生什么？

Question

我无法理解角度和节点j的组合如何创建SPA网站。

我的问题将更好地通过一个例子来解释： 让我说我试图建立一个水疗中心网站：

客户端 - 角4：

我的应用程序中有几个组件，并配置了到所有这些组件的路由。

我使用了角度cli中的ng build，并使用index.html创建了dist文件夹。

在服务器端 - 节点js： 我为index.html文件使用了静态路由。

通过浏览器访问服务器时我得到了index.html， 所有角度路线都在工作，并且可以成功地在组件之间导航。

1. 但我无法理解每次导航到不同组件时幕后发生的事情， 从服务器获取该组件？ （那时它不会是SPA ..）

2. 当我第一次访问静态路径时，是否所有组件都下载到用户浏览器，从那时起，导航只发生在客户端上？

3. html包含哪些索引？ ng build命令有什么作用？

Answer 1

1. 否。路由器从DOM中删除当前路由组件的视图，并将其替换为新路由组件的视图。它还会在浏览器的导航历史记录中推送一个新条目，如同＆＃34;你真的从新路线的网址下载了一个新页面。
2. 是。
3. index.html的内容正是您在浏览器中查看页面源时所看到的内容。或者在dist目录中查看index.html文件的内容时。它只是一个HTML页面，包含根组件和一些JS脚本。这些JS脚本是由ng build创建的包，它包含所有文件的TypeScript编译结果，应用程序使用的Angular的JS模块，以及如何构建应用程序（即没有或有 - -aot），组件的模板或这些模板的编译结果（+组件的CSS文件）。简而言之，整个应用程序捆绑在那些JS脚本中。