angular - 使用 Angular Ivy 进行延迟加载:InjectionToken ng-select-selection-model 没有提供者
问题描述
错误描述 我正在使用 Angular 的新 IVY 编译器,以及新的延迟加载功能(这里使用 ivy 进行延迟加载教程:https ://www.debugbear.com/blog/lazy-loading-angular-components-without-路由器)
当延迟加载模块并将组件实例添加到我的应用程序时,ng-select 不会出现在组件中,并且我在控制台中收到此错误:
core.js:6354 ERROR NullInjectorError: R3InjectorError(AppModule)[InjectionToken ng-select-selection-model -> InjectionToken ng-select-selection-model -> InjectionToken ng-select-selection-model]:
NullInjectorError: No provider for InjectionToken ng-select-selection-model!
at NullInjector.get (http://localhost:4200/vendor.js:8736:27)
at R3Injector.get (http://localhost:4200/vendor.js:24378:33)
at R3Injector.get (http://localhost:4200/vendor.js:24378:33)
at R3Injector.get (http://localhost:4200/vendor.js:24378:33)
at NgModuleRef$1.get (http://localhost:4200/vendor.js:40184:33)
at Object.get (http://localhost:4200/vendor.js:38095:35)
at getOrCreateInjectable (http://localhost:4200/vendor.js:12876:39)
at Module.ɵɵdirectiveInject (http://localhost:4200/vendor.js:28245:12)
at NodeInjectorFactory.NgSelectComponent_Factory [as factory] (http://localhost:4200/lazy-lazy-module.js:4143:398)
at getNodeInjectable (http://localhost:4200/vendor.js:13021:44)
可重现的示例 请参阅https://github.com/boltex/ivy-lazyload-test以获得暴露此错误的最小存储库。
重现
1. 克隆示例 repo git clone https://github.com/boltex/ivy-lazyload-test
2. 运行npm install
以获取所有依赖项 3. 运行ng serve
预期行为 使用 ng serve 在本地尝试此操作时,当程序在浏览器中加载时,请按“延迟加载模块并在下面添加组件实例”按钮。(这会将一些组件实例添加到应用程序中)该组件应该有一个 ng-select 。它没有,并且控制台中出现了前面提到的错误。
注意 忽略控制台中的第一个错误:Uncaught TypeError: ng.probe is not a function 这是使用 Angular 9 时出现的正常错误,因为如果 window.ng 存在,augury 假定 angular dev 模式处于活动状态,但 ivy 不导出马上试探。
这是一个屏幕截图
我当前的设置 - 操作系统:[windows 10] - 浏览器 [chrome] - 版本 [78.0.3904.108(官方构建)(64 位)]
感谢您对这个问题的时间和关注!
解决方案
我找到了@HeroDev 的“英雄加载器”组件的解决方案。(有关它使用的其他技术,请参阅他们相对较短的源代码:https ://github.com/herodevs/herodevs-packages/tree/master/projects )
我使用的方法与通过延迟加载将组件、第 3 方或其他方式集成到现有应用程序中的所有方法不完全兼容。(不使用路由)
我已经使用一个工作示例更新了我的存储库https://github.com/boltex/ivy-lazyload-test,您可以在其中添加和删除任意数量的不同模块和组件到打开的应用程序中,而无需更改路由。
推荐阅读
- javascript - Expo SDK36 RN 0.61.4 中的提取返回未定义
- reactjs - 使用 React / Redux 时,调度一个仅更改 Redux 状态的操作与实际执行某些任务如何?
- c++ - C++ Unreal Engine 封装委托
- angular - 移动端的离子底部标签和桌面端的侧边菜单
- mongodb - 在 mongo 中查找百分比
- python - Python:减少运行时间?
- r - 在r中的单元格中操作具有多个值的数据
- scala - 编写一个简单的基准测试来测试 scala twirl tempaltes 会出现运行时错误
- bash - 在 bash 或 zsh 命令中使用管道(“|”)作为第一个符号
- discord.py - Discord.py 如何禁止非会员用户