Angular 从 1.6.6 升级到 6 时出现 $Injector 错误

Question

我使用 Webpack 4 从 Angular.Js 1.6.6 升级到 Angular 6：

导入'core-js/es7/reflect'； 导入'zone.js'； 导入“反射元数据”； 导入'rxjs'； 从'@angular/core'导入{ NgModule }； 从“@angular/forms”导入 { FormsModule }； 从'@angular/router'导入{路由，RouterModule}； 从“@angular/platform-b​​rowser”导入 { BrowserModule }； 导入 { UpgradeModule, downgradeComponent, downgradeInjectable, setAngularJSGlobal } from '@angular/upgrade/static'; 从'./app.module.ajs'导入{模块}； 导入'./config/routes'； 从'./components/app/app'导入AppComponent； 从'./directives/application/application'导入应用程序； 从“@angular/platform-b​​rowser-dynamic”导入 { platformBrowserDynamic }； console.log('NgModule'); 常量 appRoutes: 路由 = [ ]; @NgModule({ 声明：[AppComponent，应用程序]， entryComponents：[AppComponent]， 进口：[ 浏览器模块， 表单模块， RouterModule.forRoot(appRoutes), 升级模块 ] }) 类 AppModule { 构造函数（公共升级：UpgradeModule）{ console.log('AppModule 构造函数'); } ngDoBootstrap() { console.log('AppModule ngDoBootstrap'); } } console.log('setAngularJSGlobal ...'); setAngularJSGlobal(window['angular']); console.log('setAngularJSGlobal!!!'); 进口主 = 要求（'./main'）; console.log('在 bootstrapModule 之前的 module.name:', module.name); platformBrowserDynamic().bootstrapModule(AppModule).then(platformRef => { console.log('混合模式：Angular + Angular.Js'); module.directive('appRoot', downgradeComponent({ component: AppComponent })); const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule; console.log('bootstrapModule:', module.name); 主要['launchAngular'](); upgrade.bootstrap(document.body, [module.name], { strictDi: true }); });

创建了自定义别名，为 tsconfig 添加了正确的路径，Webpack 构建通过并生成输出，但是当应用程序在浏览器中启动时，控制台中弹出错误消息：ngRoute is missing or incorrect ng module components 哪些操作未正确完成以及如何解决此错误？

Answer 1

修复了一些 Webpack 别名。替换：使用 Axios 的 Angular-Resource，使用 UI-Router/Angular-Hybrid 的 Angular-Route，将控制器重构为组件/指令和服务，摆脱 $rootScope 并发生魔术：升级开始工作。