angular - ionic /Angular 模态被延迟加载

标签 angular ionic-framework ionic4

对于任何带 Angular Ionic 模态,都有一些代码会被延迟加载。

采取toast例子。当您单击“配对”按钮时,将加载三个 javascript 文件(参见下面的屏幕截图)。第二次单击“配对”时,不会加载任何其他文件。

这对我来说是有问题的,因为我想在检测到互联网连接问题时显示 toast,因此需要完全预加载 toast 的代码。我不知道该怎么做。鉴于 Angular 的延迟加载是基于路由的,我不明白 Toast 是如何开始延迟加载代码的。

toast js resources

编辑:我知道显示隐藏的 toast 会以一种黑客的方式解决问题,但我对延迟加载系统的工作原理特别感兴趣

最佳答案

解决方案1 您可以使其预加载的是,当 Angular 加载所有文件时,为用户提供一个 Toast,以便它也加载与 Toast 相关的文件。

就像 toast 一样

“正在加载...”

“连接良好/正常”

这样,toast 文件就会在开始时加载,当网络较弱时,您可以 toast 一条消息 a,它会在文件预加载时工作。

解决方案2

您可以像透明 toast 一样 toast 隐藏样式的 toast ,使其不可见,并且对于该 toast ,文件会在第一次加载。

解决方案3

你可以将这些文件链接添加到index.html文件中作为预加载策略,这样即使不使用这些文件也会被加载,并设置缓存策略,这样即使网络不好,以前缓存的文件也会进入工作,您可以在没有互联网的情况下向用户发送消息。

关于angular - ionic /Angular 模态被延迟加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58716279/

相关文章:

angular - Ionic 4 中出现 "No provider for NgControl"错误

linux - 在虚拟机上部署后应用程序抛出错误

Angular 2 - 具有动态对象/属性的 ngModel

button - ionic 按钮的开始和结束语法没有意义

node.js - 在 Ionic 中使用 ngCordova 和 PushPlugin 的 azure 通知中心客户端代码

android - Ionic App.component.html session 未显示

css - 如何使用 Sass 在 Ionic 5 中正确使用 Var() 和 cal()

javascript - Angular 4 - 如何根据数量和选项的变化计算价格

angular - 无法解析 AddPassModal : (? 的所有参数,?)

javascript - Ionic2错误属性 'openDatabase'在类型 'Window'上不存在