问题标签 [angular-ivy]
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 - 版本 9 IVY 编译器的 Angular 项目迁移问题
我已将我的 Angular 项目版本 6 迁移到 9,但直到 8,我的迁移顺利进行并且它正在工作。一旦我从 v8 迁移到 v9,我的项目在屏幕上变为空白,IVY 在构建和 chrome 控制台上没有显示任何错误也是清除那里也没有错误我已经使用测试组件进行了测试,并且路由器插座正在工作,但是在我的项目组件上,因为常春藤一次编译每段代码,所以我无法获得受影响的区域包或代码进行调试
提前致谢。
main.ts 看起来像这样
tsconfig.json
包.json
angular - 迁移 Angular 6 -> 9 后的模板错误
我刚刚完成了从 Angular 6 到 Angular 9 的迁移,最重要的依赖项之一无法在 Angular 6 上使用。
我按照以下步骤操作ng update
:
ng update
ng update rxjs
ng update @angular/cli
ng update @angular/core
问题是我现在有很多模板错误,都与相同的问题有关。
No directive found with exportAs 'ngModel'
No directive found with exportAs 'ngForm'
我在网上没有发现任何与 v9 上的论文错误相关的内容(仅在 v2 上)。
以下是与错误相关的一些部分:
- 关于错误
ngModel
- 关于错误
ngForm
FormsModule 很好地导入app.module.ts
(这是应用程序内的唯一模块)。app.module.ts:
包.json:
我错过了迁移的东西吗?谢谢。
angular - 将数据传递给组件还是使用单例服务更高效
我有这个仪表板创建应用程序,该应用程序具有非常深的嵌套组件,我需要将状态(例如当前仪表板)传播到这些组件。当前仪表板是一个相当大的对象,其中包含有关此仪表板中的小部件的所有信息,它们在哪里,它们的外观等。
现在我正在调用数据库,将数据转换为仪表板对象,然后通过将此对象传递给工具栏、侧边栏、画布、小部件等组件来呈现仪表板。这些子组件可能会更改仪表板对象的属性,但不会更改仪表板对象本身,因此我认为不需要输出。
它工作正常,但某些组件的输入太多,有时甚至需要输出。它变得非常混乱。
我正在考虑创建一个管理整个应用程序状态的服务。我在网上找不到太多关于最佳实践的信息,只有很多方法可以做同样的事情。如果有人能提供任何关于为什么使用一种状态管理方法比另一种更好的信息,那就太好了!
angular - 如何在Angular 9中使用“延迟加载”使用子组件的事件属性绑定父组件
我正在将一些组件转换为在 Angular 9中lazily loaded
使用。ivy compiler
这是我目前的代码:
我正在尝试将代码修改为:
<ng-container #bulkUserUpload></ng-container>
我想访问fileUploaded
子组件中存在的函数,以便可以在父组件上监听事件。
如何修改上面的代码以便我可以访问子函数?
angular - 关于 Angular 9 迁移的 Angular 生产问题
大家好,我在迁移后遇到了 angular 问题,我已将项目从 angular 8 迁移到 angular 9 。带有 ng server --prod 的 Angular 在版本 8 中有效,但在版本 9 中出现错误。我已经检查了 ng build --prod 和 ng serve --prod。由于新的 Angular 9 具有用于 AOT 编译的 IVY 编译器,因此我在 main.ts 中导入了 angular/compiler,引导程序也注入了 platformBrowserDynamic,因为我可以看到 Angular 8/9 在开发模式下使用 jit 编译为 ng serve 所以项目是在 jit 上运行,但由于 angular 使用 aot 编译进行生产,我的代码库出现错误
pollyfills.ts `导入'@angular/compiler';导入'@angular/localize/init';导入'core-js/es/array';导入'zone.js/dist/zone';
`
`
tsconfig.json `
`
我在 ng serve --prod 或 ng serve --prod --aot=true 上的 chrome 控制台上遇到以下问题。 `
`
当我使用 ng serve 它在我的本地主机上服务时没有问题,但是当我添加 prod 关键字或尝试使用 ng build --prod 进行构建时。dist 文件夹在我的开发服务器上不起作用,我收到上述错误。
angular - 如何延迟加载角核心模块(FormsModule)
我正在尝试使我的捆绑包尺寸尽可能小。我有一个应用程序,所有路由都是延迟加载的。
我的 AppModule 看起来像这样:
我得到了一个看起来像这样的延迟加载模块:
我唯一的依赖FormsModule
来自像这样的延迟加载的功能模块,它只加载一些用户交互——比如点击/触摸事件。但是当我查看 main.js 时,angular 总是 bundles @angular/forms
,即使尚未导入使用它的模块。
@angular/forms
只有在创建使用它的模块时才可以加载?
我在 Ivy 下使用 Angular 9。
angular - R3InjectorError 没有 NgbDropdown 的提供程序
我有一个共享模块 A,我在其中导入和导出 NgbDropdownModule
在模块 BI 中,只需导入模块 A 和 Angular 9 一切正常。我使用了 A 中的组件,也直接使用了 ngbDropdown。
升级到 Angular 9 后,当模块 B 延迟加载时,我收到以下错误:
错误 NullInjectorError: R3InjectorError(BModule)[NgbDropdown -> NgbDropdown -> NgbDropdown -> NgbDropdown]: NullInjectorError: No provider for NgbDropdown!在 NullInjector.push../node_modules/@angular/core/ivy_ngcc/fesm5/core.js.NullInjector.get ( http ://localhost:51000/vendor.js:60672:25 ) 在 R3Injector.push../node_modules /@angular/core/ ivy_ngcc /fesm5/core.js.R3Injector.get ( http://localhost:51000/vendor.js:71020:33 ) 在 R3Injector.push../node_modules/@angular/core/ ivy_ngcc / fesm5/core.js.R3Injector.get ( http://localhost:51000/vendor.js:71020:33 ) 在 R3Injector.push../ node_modules/@angular/core/ivy_ngcc/fesm5/core.js.R3Injector。得到 (http://localhost:51000/vendor.js:71020:33 ) 在 NgModuleRef$1.push../node_modules/@angular/core/ ivy_ngcc /fesm5/core.js.NgModuleRef$1.get ( http://localhost: 51000/vendor.js:84306:33)在 R3Injector.push../node_modules/@angular/core/ivy_ngcc/fesm5/core.js.R3Injector.get ( http ://localhost:51000/vendor.js:71020: 33 ) 在 NgModuleRef$1.push../node_modules/@angular/core/ ivy_ngcc /fesm5/core.js.NgModuleRef$1.get ( http://localhost:51000/vendor.js:84306:33 ) 在 Object.get ( http://localhost:51000/vendor.js:82620:35 ) 在 getOrCreateInjectable ( http://localhost:51000/vendor.js:63536:39 ) 在 Module.ɵɵdirectiveInject (http://localhost:51000/vendor.js:73885:12 )
我究竟做错了什么?
angular - 如何使用 xlink:href 主机绑定获取组件以在启用 ivy 的情况下以角度工作
我无法为此做出成功的 plunkr,所以无论如何我都试图根据描述来问这个问题。我们有一个 NG 组件,它使用主机绑定将图标属性绑定到 svg xlink:href。
因此,一旦我们升级到 NG 9 并启用 Ivy,我们的图标就会停止工作。但是如果我们禁用 ivy,它将与 href 或 xlink:href 一起使用。
尝试在 Ng 回购中寻找错误,但似乎无法解决这个问题?有什么想法吗?
我的一个想法是您setAttributeNS
有时必须使用来设置 xlink:href。我想知道我是否需要以不同的方式绑定主机绑定,以便它使用setAttributeNS
?
angular - Angular 9 Ivy entryComponents 转换
我有一个类似上面的组件,我使用ComponentPortal
and动态创建cdkPortalOutlet
。它DynamicComponent
本身有许多它创建的出口和组件。以前entryComponents
我会列出可以加载到DynamicComponents
插座中的每个组件。这按预期工作,但现在升级到 Ivy 并删除 deprecated 后entryComponents
,这不再有效。我创建DynamicComponent
并且它初始化很好,但是内部的组件DynamicComponent
似乎没有被创建并导致整个DynamicComponent
渲染失败。如果我删除其中的插座,DynamicComponent
则其他所有内容都可以DynamicComponent
正常呈现。
我的想法是 DynamicComponent 的依赖组件在创建时没有解决。依赖组件不用于任何其他角度组件。我是否遗漏了有关如何将旧的 entryComponent 行为转换为与 Ivy 一起使用的内容?
编辑:
"buildOptimizer": false
修复它,但理想情况下希望保持这种状态。
angular - 如何使用 Ivy 修复 Angular 9 生产构建中的错误:“目标入口点“模块”中的错误缺少依赖项”
使用 Ivy 编译器在 Angular 9 中构建应用程序时,我收到以下消息:
这仅在以生产模式构建时发生。
这些错误来自我在节点模块文件夹中创建的库。
对于上述的每个错误,都会打印出另一个错误。我将在这里仅展示一个示例:
但是组件肯定在那里。我可以在我的节点模块中看到它。在 d.ts 文件和 js 文件中。
我正在通过包装器模块延迟加载模块,如此 Githb 问题底部所示:https ://github.com/angular/angular-cli/issues/6373通过包装器模块
我确实尝试导出错误输出中列出的所有文件,但它仍然抛出错误。我在库中的公共 API 看起来像这样
是否有人对如何解决此问题有任何经验或建议?
或我可以提供的更多建议信息?
谢谢