代码之家  ›  专栏  ›  技术社区  ›  Markus S.

从角度5升级到6后:错误:未捕获(承诺):类型错误:未定义不是函数

  •  2
  • Markus S.  · 技术社区  · 6 年前

    在执行步骤之后 https://update.angular.io/ 为了将我的Angular 5 SPA升级到Angular 6,我在导航到应用程序后出现此错误:

        ERROR Error: Uncaught (in promise): TypeError: undefined is not a function
    TypeError: undefined is not a function
        at Array.map (<anonymous>)
        at webpackAsyncContext ($_lazy_route_resource lazy namespace object:21)
        at SystemJsNgModuleLoader.push../node_modules/@angular/core/fesm5/core.js.SystemJsNgModuleLoader.loadAndCompile (core.js:4997)
        at SystemJsNgModuleLoader.push../node_modules/@angular/core/fesm5/core.js.SystemJsNgModuleLoader.load (core.js:4989)
        at RouterConfigLoader.push../node_modules/@angular/router/fesm5/router.js.RouterConfigLoader.loadModuleFactory (router.js:3257)
        at RouterConfigLoader.push../node_modules/@angular/router/fesm5/router.js.RouterConfigLoader.load (router.js:3245)
        at MergeMapSubscriber.project (router.js:1517)
        at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._tryNext (mergeMap.js:60)
        at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._next (mergeMap.js:50)
        at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
        at Array.map (<anonymous>)
        at webpackAsyncContext ($_lazy_route_resource lazy namespace object:21)
        at SystemJsNgModuleLoader.push../node_modules/@angular/core/fesm5/core.js.SystemJsNgModuleLoader.loadAndCompile (core.js:4997)
        at SystemJsNgModuleLoader.push../node_modules/@angular/core/fesm5/core.js.SystemJsNgModuleLoader.load (core.js:4989)
        at RouterConfigLoader.push../node_modules/@angular/router/fesm5/router.js.RouterConfigLoader.loadModuleFactory (router.js:3257)
        at RouterConfigLoader.push../node_modules/@angular/router/fesm5/router.js.RouterConfigLoader.load (router.js:3245)
        at MergeMapSubscriber.project (router.js:1517)
        at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._tryNext (mergeMap.js:60)
        at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._next (mergeMap.js:50)
        at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
        at resolvePromise (zone.js:814)
        at resolvePromise (zone.js:771)
        at zone.js:873
        at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
        at Object.onInvokeTask (core.js:3816)
        at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
        at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
        at drainMicroTaskQueue (zone.js:595)
        at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:500)
        at invokeTask (zone.js:1540)
    

    我想这与我的延迟加载功能模块路由有关,该模块路由由使用角度路由器的canactivate功能的authguard保护,但由于这发生在应用程序代码之外,我有点迷失了方向。

    我还尝试使用angular cli 6.1.2从头开始创建一个新的angular 6应用程序,然后在我的应用程序上移动,但这导致了完全相同的错误。

    这是我的包裹.json

    {
      "name": "client-app",
      "version": "0.0.0",
      "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build --prod",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
      },
      "private": true,
      "dependencies": {
        "@angular/animations": "^6.1.0",
        "@angular/cdk": "^6.2.0",
        "@angular/common": "^6.1.0",
        "@angular/compiler": "^6.1.0",
        "@angular/core": "^6.1.0",
        "@angular/flex-layout": "^6.0.0-beta.17",
        "@angular/forms": "^6.1.0",
        "@angular/http": "^6.1.0",
        "@angular/material": "^6.4.2",
        "@angular/material-moment-adapter": "^6.4.2",
        "@angular/platform-browser": "^6.1.0",
        "@angular/platform-browser-dynamic": "^6.1.0",
        "@angular/router": "^6.1.0",
        "@aspnet/signalr": "^1.0.2",
        "@ngx-translate/core": "^10.0.2",
        "@ngx-translate/http-loader": "^3.0.1",
        "@types/file-saver": "^1.3.0",
        "@types/hellojs": "^1.16.1",
        "chart.js": "^2.7.2",
        "chartjs-plugin-annotation": "^0.5.7",
        "chartjs-plugin-datalabels": "^0.3.0",
        "chartjs-plugin-zoom": "^0.6.3",
        "core-js": "^2.5.4",
        "file-saver": "^1.3.8",
        "hammerjs": "^2.0.8",
        "hellojs": "^1.17.1",
        "moment": "^2.22.2",
        "ng2-charts": "^1.6.0",
        "rxjs": "^6.0.0",
        "saturn-datepicker": "^6.0.3",
        "zone.js": "~0.8.26"
      },
      "devDependencies": {
        "@angular-devkit/build-angular": "~0.7.0",
        "@angular/cli": "~6.1.2",
        "@angular/compiler-cli": "^6.1.0",
        "@angular/language-service": "^6.1.0",
        "@types/jasmine": "~2.8.6",
        "@types/jasminewd2": "~2.0.3",
        "@types/node": "~8.9.4",
        "codelyzer": "~4.2.1",
        "jasmine-core": "~2.99.1",
        "jasmine-spec-reporter": "~4.2.1",
        "karma": "~1.7.1",
        "karma-chrome-launcher": "~2.2.0",
        "karma-coverage-istanbul-reporter": "~2.0.0",
        "karma-jasmine": "~1.1.1",
        "karma-jasmine-html-reporter": "^0.2.2",
        "protractor": "~5.3.0",
        "ts-node": "~5.0.1",
        "tslint": "~5.9.1",
        "typescript": "~2.7.2"
      }
    }
    

    我的模块级路由配置如下:

    const routes: Routes = [
      {
        path: 'login-redirect',
        component: LoginRedirectComponent
      },
      {
        path: 'settings',
        canActivate: [AuthGuard],
        component: SettingsComponent
      },
      {
        path: 'showcase',
        canActivate: [AuthGuard],
        loadChildren: '../showcase/showcase.module#ShowcaseModule'
      },
      {
        path: 'feature1',
        canActivate: [AuthGuard],
        loadChildren: '../feature1/feature1.module#Feature1Module'
      },
      {
        path: 'feature2',
        canActivate: [AuthGuard],
        loadChildren: '../feature2/feature2.module#Feature2Module'
      },
      {
        path: '**', redirectTo: '/feature2'
      }
    ];
    
    2 回复  |  直到 6 年前
        2
  •  0
  •   Nickofthyme    6 年前

    app.module.ts

    // This is BAD!
    import { MyModule } from '../my-modules/index';
    
    // This is GOOD?
    import { MyModule } from '../my-modules/my.module';
    

    推荐文章