我有一个Angular2项目,在Mac OS上创建并运行.但是当我在
Windows上使用它时,它无法运行.
在Chrome中,我收到此错误:
在Chrome中,我收到此错误:
core.umd.js:3491 EXCEPTION: Uncaught (in promise): TypeError: Cannot set property 'name' of undefined TypeError: Cannot set property 'name' of undefined at new EmptyError (http://localhost:3000/node_modules/rxjs/util/EmptyError.js:21:30) at FirstSubscriber._complete (http://localhost:3000/node_modules/rxjs/operator/first.js:148:31) at FirstSubscriber.Subscriber.complete (http://localhost:3000/node_modules/rxjs/Subscriber.js:114:18) at MergeAllSubscriber._complete (http://localhost:3000/node_modules/rxjs/operator/mergeAll.js:94:30) at MergeAllSubscriber.Subscriber.complete (http://localhost:3000/node_modules/rxjs/Subscriber.js:114:18) at MapSubscriber.Subscriber._complete (http://localhost:3000/node_modules/rxjs/Subscriber.js:132:26) at MapSubscriber.Subscriber.complete (http://localhost:3000/node_modules/rxjs/Subscriber.js:114:18) at EmptyObservable._subscribe (http://localhost:3000/node_modules/rxjs/observable/EmptyObservable.js:69:24) at EmptyObservable.Observable.subscribe (http://localhost:3000/node_modules/rxjs/Observable.js:45:27) at Observable._subscribe (http://localhost:3000/node_modules/rxjs/Observable.js:103:28) at MapOperator.call (http://localhost:3000/node_modules/rxjs/operator/map.js:54:23) at Observable.subscribe (http://localhost:3000/node_modules/rxjs/Observable.js:42:22) at Observable._subscribe (http://localhost:3000/node_modules/rxjs/Observable.js:103:28) at MergeAllOperator.call (http://localhost:3000/node_modules/rxjs/operator/mergeAll.js:63:23) at Observable.subscribe (http://localhost:3000/node_modules/rxjs/Observable.js:42:22) core.umd.js:3496 ORIGINAL STACKTRACE:ErrorHandler.handleError @ core.umd.js:3496next @ core.umd.js:8449schedulerFn @ core.umd.js:4118SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.js:4104NgZone.triggerError @ core.umd.js:4465onHandleError @ core.umd.js:4426ZoneDelegate.handleError @ zone.js:246Zone.runGuarded @ zone.js:129_loop_1 @ zone.js:429drainMicroTaskQueue @ zone.js:438ZoneTask.invoke @ zone.js:349 core.umd.js:3497 Error: Uncaught (in promise): TypeError: Cannot set property 'name' of undefined TypeError: Cannot set property 'name' of undefined at new EmptyError (EmptyError.ts:14) at FirstSubscriber._complete (first.ts:161) at FirstSubscriber.Subscriber.complete (Subscriber.ts:122) at MergeAllSubscriber._complete (mergeAll.ts:91) at MergeAllSubscriber.Subscriber.complete (Subscriber.ts:122) at MapSubscriber.Subscriber._complete (Subscriber.ts:144) at MapSubscriber.Subscriber.complete (Subscriber.ts:122) at EmptyObservable._subscribe (EmptyObservable.ts:74) at EmptyObservable.Observable.subscribe (Observable.ts:98) at Observable._subscribe (Observable.ts:158) at MapOperator.call (map.ts:50) at Observable.subscribe (Observable.ts:96) at Observable._subscribe (Observable.ts:158) at MergeAllOperator.call (mergeAll.ts:61) at Observable.subscribe (Observable.ts:96) at resolvePromise (zone.js:486) [angular] at resolvePromise (zone.js:471) [angular] at :3000de_modules/zone.js/dist/zone.js:520:17 [angular] at Object.onInvokeTask (core.umd.js:4396) [angular] at ZoneDelegate.invokeTask (zone.js:274) [angular] at Zone.runTask (zone.js:151) [<root> => angular] at drainMicroTaskQueue (zone.js:418) [<root>] at XMLHttpRequest.ZoneTask.invoke (zone.js:349) [<root>]ErrorHandler.handleError @ core.umd.js:3497next @ core.umd.js:8449schedulerFn @ core.umd.js:4118SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.js:4104NgZone.triggerError @ core.umd.js:4465onHandleError @ core.umd.js:4426ZoneDelegate.handleError @ zone.js:246Zone.runGuarded @ zone.js:129_loop_1 @ zone.js:429drainMicroTaskQueue @ zone.js:438ZoneTask.invoke @ zone.js:349 zone.js:405 Unhandled Promise rejection: TypeError: Cannot set property 'name' of undefined(…) ; Zone: angular ; Task: Promise.then ; Value: TypeError: Cannot set property 'name' of undefined(…) undefined
在Firefox中,我收到此错误:
EXCEPTION: Uncaught (in promise): TypeError: err is undefined EmptyError@http://localhost:3000/node_modules/rxjs/util/EmptyError.js:21:9 FirstSubscriber.prototype._complete@http://localhost:3000/node_modules/rxjs/operator/first.js:148:31 Subscriber.prototype.complete@http://localhost:3000/node_modules/rxjs/Subscriber.js:114:13 MergeAllSubscriber.prototype._complete@http://localhost:3000/node_modules/rxjs/operator/mergeAll.js:94:13 Subscriber.prototype.complete@http://localhost:3000/node_modules/rxjs/Subscriber.js:114:13 Subscriber.prototype._complete@http://localhost:3000/node_modules/rxjs/Subscriber.js:132:9 Subscriber.prototype.complete@http://localhost:3000/node_modules/rxjs/Subscriber.js:114:13 EmptyObservable.prototype._subscribe@http://localhost:3000/node_modules/rxjs/observable/EmptyObservable.js:69:13 Observable.prototype.subscribe@http://localhost:3000/node_modules/rxjs/Observable.js:45:22 Observable.prototype._subscribe@http://localhost:3000/node_modules/rxjs/Observable.js:10[…] ORIGINAL STACKTRACE: core.umd.js:3496:17 resolvePromise@http://localhost:3000/node_modules/zone.js/dist/zone.js:486:31 [angular] resolvePromise@http://localhost:3000/node_modules/zone.js/dist/zone.js:471:17 [angular] scheduleResolveOrRejecthttp://localhost:3000/node_modules/zone.js/dist/zone.js:520:17 [angular] NgZone</NgZone.prototype.forkInnerZoneWithAngularBehavior/this.inner<.onInvokeTask@http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:4396:32 [angular] ZoneDelegate.prototype.invokeTask@http://localhost:3000/node_modules/zone.js/dist/zone.js:274:21 [angular] Zone.prototype.runTask@http://localhost:3000/node_modules/zone.js/dist/zone.js:151:28 [<root> => angular] drainMicroTaskQueue@http://localhost:3000/node_modules/zone.js/dist/zone.js:418:25 [<root>] ZoneTask/this.invoke@http://localhost:3000/node_modules/zone.js/dist/zone.js:349:25 [<root>] core.umd.js:3497:17 Unhandled Promise rejection: TypeError: err is undefined 堆栈跟踪: [object Object] ; Zone: angular ; Task: Promise.then ; Value: TypeError: err is undefined 堆栈跟踪: [object Object] undefined zone.js:405:13 Object { message: "Uncaught (in promise): TypeError: err is undefined EmptyError@http://localhost:3000/node_modules/rxjs/util/EmptyError.js:21:9 FirstSubscriber.prototype._complete@http://localhost:3000/node_modules/rxjs/operator/first.js:148:31 Subscriber.prototype.complete@http://localhost:3000/node_modules/rxjs/Subscriber.js:114:13 MergeAllSubscriber.prototype._complete@http://localhost:3000/node_modules/rxjs/operator/mergeAll.js:94:13 Subscriber.prototype.complete@http://localhost:3000/node_modules/rxjs/Subscriber.js:114:13 Subscriber.prototype._complete@http://localhost:3000/node_modules/rxjs/Subscriber.js:132:9 Subscriber.prototype.complete@http://localhost:3000/node_modules/rxjs/Subscriber.js:114:13 EmptyObservable.prototype._subscribe@http://localhost:3000/node_modules/rxjs/observable/EmptyObservable.js:69:13 Observable.prototype.subscribe@http://localhost:3000/node_modules/rxjs/Observable.js:45:22 Observable.prototype._subscribe@http://localhost:3000/node_modules/rxjs/Observable.js:103:16 MapOpe"[…],originalStack: "ZoneAwareError@http://localhost:300…",zoneAwareStack: "resolvePromise@http://localhost:300…",stack: "resolvePromise@http://localhost:300…",rejection: TypeError,promise: Object,zone: Object,task: Object }
为什么?
这些是我的代码:
app.module.ts
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { CookieService } from 'angular2-cookie/core'; import './rxjs-operators'; import { LoginModule } from './login/login.module'; import { HomeModule } from './home/home.module'; import { AppComponent } from './app.component'; import { LoadingComponent } from './loading/loading.component'; import { NavigationComponent } from './navigation/navigation.component'; import { LoginTransferService } from './service/transfer/login-transfer.service'; import { AppRoutingModule } from './app-routing.module'; import { AppRouteGuardsService } from './app-route-guards.service'; @NgModule({ imports: [ BrowserModule,AppRoutingModule,LoginModule,HomeModule,],declarations: [ AppComponent,LoadingComponent,NavigationComponent,providers: [ CookieService,AppRouteGuardsService,LoginTransferService ],bootstrap: [ AppComponent ] }) export class AppModule { }
app.component.ts
import { Component } from '@angular/core'; import './rxjs-operators'; @Component({ selector: 'my-app',template: ` <ArrowIMWP-navigation></ArrowIMWP-navigation> <router-outlet></router-outlet> `,styleUrls: ['app/app.component.css'] }) export class AppComponent { }
APP-routing.module.ts
import { NgModule } from '@angular/core'; import { RouterModule,Routes } from '@angular/router'; import { LoadingComponent } from './loading/loading.component'; import { AppRouteGuardsService } from './app-route-guards.service'; const routes: Routes = [{ path: '',component: LoadingComponent,canActivate : [ AppRouteGuardsService ] }]; @NgModule({ imports: [ RouterModule.forRoot(routes) ],exports: [ RouterModule ] }) export class AppRoutingModule {}
APP-路由guards.service.ts
import { Injectable } from '@angular/core'; import { Router,CanActivate,ActivatedRouteSnapshot,RouterStateSnapshot } from '@angular/router'; import { CookieService } from 'angular2-cookie/core'; @Injectable() export class AppRouteGuardsService implements CanActivate { constructor(private cookieService:CookieService,private router:Router) {}; canActivate(route: ActivatedRouteSnapshot,state: RouterStateSnapshot) { let tempIsLogined = this.cookieService.getObject("ArrowIMWP-IsLogined"); if (tempIsLogined && tempIsLogined == true) { if (state.url == "/") { this.router.navigate(['/home']); return false; } return true; }else { if (state.url == "/login") { return true; } this.router.navigate(['/login']); return false; } } }
navigation.component.ts
import { Component,OnInit } from '@angular/core'; import { Router } from '@angular/router'; import { CookieService } from 'angular2-cookie/core'; import { LoginTransferService } from '../service/transfer/login-transfer.service'; @Component({ moduleId: module.id,selector: 'ArrowIMWP-navigation',templateUrl: 'navigation.component.html',styleUrls: ['navigation.component.css'] }) export class NavigationComponent implements OnInit { isShowNavigationItems = false; constructor( private router:Router,private cookieService:CookieService,private loginTransferService:LoginTransferService ) { let tempIsLogined = cookieService.getObject("ArrowIMWP-IsLogined"); if (tempIsLogined && tempIsLogined == true) { this.isShowNavigationItems = true; }else { this.isShowNavigationItems = false; } loginTransferService.loginSuccessed$.subscribe( data => { console.log(data); if (data == "Logined") { this.isShowNavigationItems = true; } } ) } }
login.module.ts
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { CookieService } from 'angular2-cookie/services/cookies.service'; import '../rxjs-operators'; import { LoginComponent } from './login.component'; import { LoginRoutingModule } from './login-routing.module'; import { LoginRouteGuardsService } from './login-route-guards.service'; @NgModule({ imports: [ BrowserModule,LoginRoutingModule ],declarations: [ LoginComponent ],LoginRouteGuardsService ],bootstrap: [ LoginComponent ] }) export class LoginModule {}
login.component.ts
import { Component,OnInit } from '@angular/core'; import { CookieService } from 'angular2-cookie/core'; import { Router } from '@angular/router'; import '../rxjs-operators'; import { LoginTransferService } from '../service/transfer/login-transfer.service'; @Component({ moduleId: module.id,selector: 'ArrowIMWP-login',templateUrl: 'login.component.html',styleUrls : ['login.component.css'] }) export class LoginComponent implements OnInit { constructor( private cookieService:CookieService,private router:Router,private loginTransferService:LoginTransferService ) {} loginButtonClicked() { this.cookieService.putObject("ArrowIMWP-IsLogined",true); this.router.navigate(['/home']); this.loginTransferService.loginSuccessedNext("Logined"); } }
登录-routing.module.ts
import { NgModule } from '@angular/core'; import { RouterModule,Routes } from '@angular/router'; import { LoginComponent } from './login.component'; import { LoginRouteGuardsService } from './login-route-guards.service'; @NgModule({ imports: [ RouterModule.forChild([{ path: 'login',component: LoginComponent,canActivate : [ LoginRouteGuardsService ] }]) ],exports: [ RouterModule ] }) export class LoginRoutingModule {}
登录路由,guards.service.ts
import { Injectable,OnInit } from '@angular/core'; import { Router,RouterStateSnapshot } from '@angular/router'; import { CookieService } from 'angular2-cookie/core'; @Injectable() export class LoginRouteGuardsService implements OnInit,CanActivate { constructor(private cookieService:CookieService,state: RouterStateSnapshot) { let tempIsLogined = this.cookieService.getObject("ArrowIMWP-IsLogined"); if (tempIsLogined && tempIsLogined == true) { this.router.navigate(['/home']); return false; }else { return true; } } }
你在package.json中使用了zone.js 0.7.3吗?若是,请改为0.7.2试试:
原文链接:https://www.f2er.com/angularjs/142397.html"zone.js": "0.7.2"
运行npm install来试试.