会 Angular Universal/Prerendering 加载动态加载的内容吗？
Will Angular Universal/Prerendering Load Content That Is Dynamically Loaded?
我有一个 angular 网络应用程序，它在组件的构造函数中从 Firebase Firestore 加载数据（产品）。然后它在页面上显示产品列表。虽然数据是动态的，但它不会经常更改。例如，价格可能会发生变化，但产品本身会保持不变。
我想实现 Angular 通用和预呈现，但我想确认构造函数中加载的产品列表将包含在预呈现的静态页面中。
这是真的吗？
此外，是否可以在每晚或更新数据库时向 "re-prerender" 编写一个函数？
Angular Universal 允许您在页面提供之前加载页面中的内容（在您的情况下为产品列表）。但是，它不会提前输出静态页面，通常您会发现自己有条件地 运行 宁某些代码服务器端和某些代码客户端（使用 isPlatformServer 和 isPlatformBrowser）。同样值得注意的是，您需要禁用、清理或替换 DOM 引用和其他浏览器相关代码到服务器上的 运行（使用 Angular 引用，例如 ViewChildren，将在 Universal/server-side).
中表现得很好
至于常规预渲染，Universal 旨在按需交付 application/page，不会提前输出页面。如果您希望减少负载，我建议您结合使用 URL 参数和缓存（例如使用 CDN）。
设置完毕并接受代码需要支持无浏览器环境后，Angular Universal 非常简洁，可以让您做一些独特的事情。我认为它更像是服务器渲染、客户端渲染的混合体。但是，它不是预呈现页面的 "plug and play" 解决方案。
Angular Universal 也可以进行静态预渲染。然后将在构建期间提出任何请求。
最快的尝试方法是通过以下命令使用 schematic：
ng add @ng-toolkit/universal
看看创建的 prerender.ts 和 package.json 中 scripts 的变化。
在文件static.paths.ts中你可以定义应该预渲染的路由：
export const ROUTES = [
'/commits/yanxch'
];
然后 运行 npm run build:prerender 您应该会在 dist 文件夹中看到一个新的 static 文件夹。
基本上，构建时请求的响应状态被放入 <script id="serverApp-state">..</script>
下的 index.html 文件中
此解决方案在浏览器端使用所谓的 ServerTransferStateModule 和 TransferHttpCacheModule 来避免发出两次请求（在构建期间在服务器上和客户端应用程序启动时）。
您可以在夜间构建期间触发此操作，然后部署新构建的应用程序，但该过程更多地取决于构建管道的需求和设置。所以是的，执行 DB-Query 然后执行新的预渲染构建的构建脚本也是可能的。
你也可以看看我的example.
我有一个 angular 网络应用程序，它在组件的构造函数中从 Firebase Firestore 加载数据（产品）。然后它在页面上显示产品列表。虽然数据是动态的，但它不会经常更改。例如，价格可能会发生变化，但产品本身会保持不变。
我想实现 Angular 通用和预呈现，但我想确认构造函数中加载的产品列表将包含在预呈现的静态页面中。
这是真的吗？
此外，是否可以在每晚或更新数据库时向 "re-prerender" 编写一个函数？
Angular Universal 允许您在页面提供之前加载页面中的内容（在您的情况下为产品列表）。但是，它不会提前输出静态页面，通常您会发现自己有条件地 运行 宁某些代码服务器端和某些代码客户端（使用 isPlatformServer 和 isPlatformBrowser）。同样值得注意的是，您需要禁用、清理或替换 DOM 引用和其他浏览器相关代码到服务器上的 运行（使用 Angular 引用，例如 ViewChildren，将在 Universal/server-side).
中表现得很好至于常规预渲染，Universal 旨在按需交付 application/page，不会提前输出页面。如果您希望减少负载，我建议您结合使用 URL 参数和缓存（例如使用 CDN）。
设置完毕并接受代码需要支持无浏览器环境后，Angular Universal 非常简洁，可以让您做一些独特的事情。我认为它更像是服务器渲染、客户端渲染的混合体。但是，它不是预呈现页面的 "plug and play" 解决方案。
Angular Universal 也可以进行静态预渲染。然后将在构建期间提出任何请求。
最快的尝试方法是通过以下命令使用 schematic：
ng add @ng-toolkit/universal
看看创建的 prerender.ts 和 package.json 中 scripts 的变化。
在文件static.paths.ts中你可以定义应该预渲染的路由：
export const ROUTES = [
'/commits/yanxch'
];
然后 运行 npm run build:prerender 您应该会在 dist 文件夹中看到一个新的 static 文件夹。
基本上，构建时请求的响应状态被放入 <script id="serverApp-state">..</script>
index.html 文件中
此解决方案在浏览器端使用所谓的 ServerTransferStateModule 和 TransferHttpCacheModule 来避免发出两次请求（在构建期间在服务器上和客户端应用程序启动时）。
您可以在夜间构建期间触发此操作，然后部署新构建的应用程序，但该过程更多地取决于构建管道的需求和设置。所以是的，执行 DB-Query 然后执行新的预渲染构建的构建脚本也是可能的。
你也可以看看我的example.