问题标签 [angular-lazyloading]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angular - 在角度模块中导入不需要的功能模块是否会增加大小或影响性能
我有多个功能/组件正在不同的 Angular 模块中使用.. 目前分别加载它们
如果我将所有这些功能放在一个共享模块中,然后在所有功能模块中调用它,如下所示:
它会导致延迟还是变慢,因为所有模块都没有使用许多功能.. 例如:模块 2 只需要功能 3 和 5,但是因为我将导入整个共享模块.. 它会影响性能吗在加载模块 2 时。
angular - 延迟加载的组件和路由
我有一个名为 A 的延迟加载模块。我在导航到“a/comp1/:data1”时加载了 A。
为了实现它,我在我的 app.module 中声明了这样的路由:
在 A 模块中,我声明了其他路线,例如:
在我的 comp1 中有一些片段,当我更改片段时,我想滚动到片段。实际行为:我的 comp1 被销毁然后重新初始化(然后它滚动到片段)。
也许我做错了什么。使用lazyLoad 声明?
如何防止应用程序在片段更改时重新加载?
angular - 角度路由问题(路由器未注册点击)
我被困住了,感谢您的帮助。
我是 Angular 的新手,并使用延迟加载方法来加载模块。我有一个带有路由模块的主模块,该模块包含所有子路由。如下
--- 主路由聚合器模块 ---
同样,每个组件/模块堆栈都有自己的路由模块,如下所示
---- 带有路由定义的单个模块---
--- 用户链接被硬编码的组件 ----
问题:
当我点击链接几次(50% 的时间)时,点击不会记录对路由的更改。屏幕变为空白,经过检查,URL 保持不变。
例如,用户现在在博客(聚光灯)页面上并点击商店页面。
- 画面变黑,
- URL 仍然显示 /spotlight 而不是 /shop。
- 然后用户点击不同的链接说 /designerperfumes
- 屏幕加载设计师香水组件,一切都很好
- 用户现在点击商店链接 - 屏幕现在加载商店页面。
在所有 3 个(Chrome、Safari 和 Firefox 浏览器)中,这种情况发生的概率为 50%。我无法弄清楚发生了什么,因为我对角度路由和延迟加载有基本的了解。
你能帮忙吗?
谢谢。
angular - Angular 8 更新打破了模块的延迟加载
我有一个最初使用 Angular 6 开发的应用程序,并且已经在生产环境中运行了两年多。本周我开始使用 Angular 更新指南将其逐步更新到最新的稳定版本。
从 6 到 7 完美无缺,但试图从 7 到 8 一直很痛苦。跟随指南进展顺利;我唯一不需要包含在指南中的就是从ng4-loading-spinner
to移开ngx-loading-spinner
。该应用程序可以毫无问题地编译和加载急切的模块,但所有延迟加载的模块(我可以在不登录的情况下导航到的模块)都会抛出“BrowserModule 已加载”异常。
我在这里找到了所有相关的问题和答案,关于只导入BrowserModule
一次,甚至从我的应用程序模块中删除了一些可能已经导入BrowserModule
的导入(包括ngx-loading-spinner
)。
问题:
- 从 7 更新到 8 是否存在已知问题,我无法解决我的问题?
- 如果没有,我怎样才能找到罪魁祸首?
堆栈跟踪:
angular - 'mat-card-content' 不是已知元素:
我在使用 Angular Universal、延迟加载和共享材料模块时遇到此错误。当我运行时出现npm run dev:ssr
此错误,我认为这是延迟加载和 Angular Universal 的结合。
'mat-card-content' 不是已知元素
angular - 在服务中使用 ngx-translate (TranslateService) 时出现“无法读取未定义的属性‘即时’”
我正在尝试通过组件进行翻译,因为我打算在 sweetAlert 弹出窗口中使用翻译。我得到“无法读取未定义的属性'即时'”。我想知道我错在哪里。
注意:我正在使用延迟加载模块
应用模块
我尝试使用 TranslateService 的服务
angular - 仅包含服务的角度延迟加载模块?
我正在寻找一种方法来延迟加载不包含任何组件但仅包含服务的模块。背景:在我的应用程序中是使用exceljs
库的 Excel 导出服务。这个库非常大,我试图防止该库成为vendor.js
or的一部分main.js
。它通过import * as Excel from 'exceljs/dist/exceljs.min.js'
服务“包含”。
现在,我在使用“Excel 导出”服务的单独模块中有几个组件(无组件)。我更喜欢仅在用户“单击导出按钮”而不是之前加载服务的方法。
如何做到这一点?
angular - Angular 9 - 无法在延迟加载的模块上停用路由器插座
Baiscally 我有一个组件需要在激活/停用 a 时有条件地显示named router-outlet
。激活方面没问题,但是当 url 变回时它不起作用(即有人按下浏览器的后退箭头):仍然显示路由器出口内容。我认为主要问题是路由器插座是延迟加载模块的一部分。我已经检查了 Angular 7 的这个先前的答案,但它对我的项目(Angular 9)没有影响。
这是我的路由模块路由
router-outlet
这就是指令所在的模板
注意: checkOutlet($event)只是一个测试,用于在router-outlet内置事件发射器触发某些东西时在控制台上打印一些东西。这使我发现当路由器插座激活时正确触发了一个事件,但是当 url 变回时没有任何反应(因此,路由器插座应该停用)。
最后是懒加载模块LTOModule的路由模块
不知道它是否有用,但这也是我的路由器插座被激活的模板部分
****************编辑*****************
我注意到,当我按下第四箭头时,出现以下错误:ERROR Error: Uncaught (in promise): Error: Cannot activate an already activated outlet
angular - 角度延迟加载:loadChildren 不同的行为
伙计们,我有一个启用延迟加载的 Angular 应用程序,并且在模块之下。
CoreModule, (app 模块中导入)
SharedModule, (各个模块中导入)
ProjectsModule,
AuthModule
这是我的应用路由模块:
在根应用程序路由模块中使用动态导入语法时,在浏览器中获取的 javascript 包如下:(刷新 /auth/sign-in)
- 核心认证认证模块.js
- 默认~core-auth-auth-module~projects-projects-module.js
- 项目-项目-module.js(预加载)
1- 那么模块 1 和 2 到底是什么?
然后,当我在 loadchildren 上使用函数语法时,前 2 个模块不会在浏览器中加载。
2-有什么区别?
angular - NgModuleFactoryLoader.load() 找不到模块
请在此处参考我的项目结构我已经创建了一个包含多个延迟加载的嵌套模块的项目。
- 在应用程序启动时加载 AppModule
- 当用户点击登录按钮 LoginModule 被加载
- 如果用户存在,即登录成功,AppModule 的另一个功能模块IntegratedPmntsModule 应该从login-routing.module.ts 延迟加载。它使用 'button routerLink='integratePayments' class="pmntButton"' 完美加载 IntegratedPmntsModule ,但这不是我想要的。
我的要求是有条件地加载功能子模块,如组件 login.component.ts 所示,当用户登录失败时,他应该导航到登录(它工作正常,因为 LoginModule 已经延迟加载)并且登录成功时用户应该导航到 IntegratedPmntsModule 中存在的 IntegratedPaymentsComponent(这不会发生)。
this.router.navigate(['integratedPayments']); - 正在给出“未捕获(承诺):错误:无法匹配任何路线“integratedPayments”
我什至尝试使用 NgModuleFactoryLoader.load() 的 load() 方法加载 IntegratedPmntsModule,该方法给出“未找到模块错误”