Angular4 - ZoneAwareError-6ren

Angular4 - ZoneAwareError

转载作者：太空狗更新时间：2023-10-29 18:13:36

当我尝试运行看起来像这样的 Angular4 时，我突然看到一个错误...

ERROR ZoneAwareError {__zone_symbol__error: Error: Uncaught (in promise): Error
Error
at Error.ZoneAwareError (http://localhost:4200/vendor.……}message: (...)name: (...)originalStack: (...)promise: ZoneAwarePromiserejection: Errorstack: (...)task: ZoneTasktoSource: function ()toString: function ()zone: ZonezoneAwareStack: (...)__zone_symbol__error: Error: Uncaught (in promise): 
Error
Error
at Error.ZoneAwareError (http://localhost:4200/vendor.bundle.js:97291:33)
at ZoneAwareError (http://localhost:4200/vendor.bundle.js:97288:35)
at injectionError (http://localhost:4200/vendor.bundle.js:2061:86)
at noProviderError (http://localhost:4200/vendor.bundle.js:2099:12)
at ReflectiveInjector_._throwOrNull (http://localhost:4200/vendor.bundle.js:3601:19)
at ReflectiveInjector_._getByKeyDefault (http://localhost:4200/vendor.bundle.js:3640:25)
at ReflectiveInjector_._getByKey (http://localhost:4200/vendor.bundle.js:3572:25)
at ReflectiveInjector_.get (http://localhost:4200/vendor.bundle.js:3441:21)
at AppModuleInjector.NgModuleInjector.get (http://localhost:4200/vendor.bundle.js:4406:52)
at resolveDep (http://localhost:4200/vendor.bundle.js:11810:45)
at createClass (http://localhost:4200/vendor.bundle.js:11673:147)
at createDirectiveInstance (http://localhost:4200/vendor.bundle.js:11504:37)
at createViewNodes (http://localhost:4200/vendor.bundle.js:12853:49)
at createRootView (http://localhost:4200/vendor.bundle.js:12758:5)
at callWithDebugContext (http://localhost:4200/vendor.bundle.js:13889:42)
at Error.ZoneAwareError (http://localhost:4200/vendor.bundle.js:97291:33)
at ZoneAwareError (http://localhost:4200/vendor.bundle.js:97288:35)
at injectionError (http://localhost:4200/vendor.bundle.js:2061:86)
at noProviderError (http://localhost:4200/vendor.bundle.js:2099:12)
at ReflectiveInjector_._throwOrNull (http://localhost:4200/vendor.bundle.js:3601:19)
at ReflectiveInjector_._getByKeyDefault (http://localhost:4200/vendor.bundle.js:3640:25)
at ReflectiveInjector_._getByKey (http://localhost:4200/vendor.bundle.js:3572:25)
at ReflectiveInjector_.get (http://localhost:4200/vendor.bundle.js:3441:21)
at AppModuleInjector.NgModuleInjector.get (http://localhost:4200/vendor.bundle.js:4406:52)
at resolveDep (http://localhost:4200/vendor.bundle.js:11810:45)
at createClass (http://localhost:4200/vendor.bundle.js:11673:147)
at createDirectiveInstance (http://localhost:4200/vendor.bundle.js:11504:37)
at createViewNodes (http://localhost:4200/vendor.bundle.js:12853:49)
at createRootView (http://localhost:4200/vendor.bundle.js:12758:5)
at callWithDebugContext (http://localhost:4200/vendor.bundle.js:13889:42)
at resolvePromise (http://localhost:4200/vendor.bundle.js:96964:31) [angular]
at resolvePromise (http://localhost:4200/vendor.bundle.js:96935:17) [angular]
at http://localhost:4200/vendor.bundle.js:97012:17 [angular]
at Object.onInvokeTask (http://localhost:4200/vendor.bundle.js:4965:37) [angular]
at ZoneDelegate.invokeTask (http://localhost:4200/vendor.bundle.js:96665:36) [angular]
at Zone.runTask (http://localhost:4200/vendor.bundle.js:96465:47) [<root> => angular]
at drainMicroTaskQueue (http://localhost:4200/vendor.bundle.js:96845:35) 
[<root>]
at HTMLAnchorElement.ZoneTask.invoke 
(http://localhost:4200/vendor.bundle.js:96723:25) [<root>]get message: function ()set message: function (value)get name: function ()set name: function (value)get originalStack: function ()set originalStack: function (value)get stack: function ()set stack: function (value)get zoneAwareStack: function ()set 
zoneAwareStack: function (value)__proto__: Object
defaultErrorLogger @ core.es5.js:1085
ErrorHandler.handleError @ core.es5.js:1145
next @ core.es5.js:4774
schedulerFn @ core.es5.js:3848
SafeSubscriber.__tryOrUnsub @ Subscriber.js:234
SafeSubscriber.next @ Subscriber.js:183
Subscriber._next @ Subscriber.js:125
Subscriber.next @ Subscriber.js:89
Subject.next @ Subject.js:55
EventEmitter.emit @ core.es5.js:3834
NgZone.triggerError @ core.es5.js:4205
onHandleError @ core.es5.js:4166
ZoneDelegate.handleError @ zone.js:338
Zone.runGuarded @ zone.js:142
_loop_1 @ zone.js:557
drainMicroTaskQueue @ zone.js:566
ZoneTask.invoke @ zone.js:424

我无法弄清楚是我的代码的哪一部分创建了这个，因为应用程序的其他部分继续正常工作。当我尝试将我的代码回滚到错误前的版本时，我仍然收到错误。错误非常模糊，我不知道是哪个文件或文件的一部分导致了错误。

有人对如何开始寻找这个有任何想法吗？

更新:错误似乎是在我将服务导入组件时出现的。以下是导入和使用服务的仪表板组件的代码。如果我从仪表板组件构造函数中删除它...

private CaseService: CaseService

错误消失了。这是仪表板组件...

import {Component} from '@angular/core'
import {Router,ActivatedRoute} from '@angular/router'

import {Globals} from '../../models/globals.model'
import {CaseService} from '../../services/case.service'

@Component({
    templateUrl: 'dashboard.html'
})

export class DatabaseDashboard{

    constructor(private Globals: Globals, private Router: Router, private CaseService: CaseService){     


   if(this.Globals.CurrentUser.IsLoggedIn !== true){
        this.Router.navigateByUrl('/login')
   }

   let PackageAuthorised = false
   Globals.CurrentUser.Packages.forEach(Package => {
       if(Package.PackageID == 1){ // 1 = Database Package in packages table
           PackageAuthorised = true
       }
   });

   if(PackageAuthorised === false){
        this.Router.navigateByUrl('/login')
   }


   this.CaseService.getAllCasesByUserid().subscribe(
    data => {                
        console.log(data)
        if(data != null){
            this.Globals.Cases = data                   
        } else {
            alert("Failed to fetch Cases from Database")
        }
    })


    }

}

...这是服务...

import {Component} from '@angular/core'
import {Http,Headers, RequestOptions,URLSearchParams  } from '@angular/http'

import 'rxjs/Rx'
import { Observable } from 'rxjs/Observable'

import {Settings} from '../models/settings.model'
import {Globals} from '../models/globals.model'
import {Case} from '../models/case.model'

@Component({ 

})

export class CaseService {

constructor(private _http: Http, private Settings: Settings, private Globals: Globals) { 

}

getAllCases(){    
    console.log(this.Settings.ApiURL + 'cases.php?Method=getAllCases&AdminEmail=' + this.Globals.CurrentUser.UserEmail + '&AdminPassword=' + this.Globals.CurrentUser.UserPassword)
    return this._http.get(this.Settings.ApiURL + 'cases.php?Method=getAllCases&AdminEmail=' + this.Globals.CurrentUser.UserEmail + '&AdminPassword=' + this.Globals.CurrentUser.UserPassword).map(
        result => {                
            let data = result.json()
            console.log(data)
            return data
        }
    )               
}


getAllCasesByUserid(){    
    console.log(this.Settings.ApiURL + 'cases.php?Method=getAllCasesByUserid&UserID=1&UserEmail=' + this.Globals.CurrentUser.UserEmail + '&UserPassword=' + this.Globals.CurrentUser.UserPassword)
    return this._http.get(this.Settings.ApiURL + 'cases.php?Method=getAllCasesByUserid&UserID=1&UserEmail=' + this.Globals.CurrentUser.UserEmail + '&UserPassword=' + this.Globals.CurrentUser.UserPassword).map(
        result => {  
            console.log(result)              
            let data = result.json()                
            return data
        }
    )               
}

deleteCase(CaseID: number){
     console.log(this.Settings.ApiURL + 'cases.php?Method=deleteCase&UserEmail=' + this.Globals.CurrentUser.UserEmail + '&UserPassword=' + this.Globals.CurrentUser.UserPassword + '&CaseID=' + CaseID )

    return this._http.get(this.Settings.ApiURL + 'cases.php?Method=deleteCase&UserEmail=' + this.Globals.CurrentUser.UserEmail + '&UserPassword=' + this.Globals.CurrentUser.UserPassword + '&CaseID=' + CaseID ).map(
        result => {
            let data = result.json()
            return data
        }
    ) 
}

saveNewCase(Case: Case){
    console.log(this.Settings.ApiURL + 'cases.php?Method=saveNewCase&UserEmail=' + this.Globals.CurrentUser.UserEmail + '&UserPassword=' + this.Globals.CurrentUser.UserPassword + '&CaseUniqueCode=' + Case.CaseUniqueCode + '&CaseTitle=' + Case.CaseTitle  + '&CreatorUserid=' + Case.CreatorUserid + '&CaseBriefDesc=' + Case.CaseBriefDesc)

    return this._http.get(this.Settings.ApiURL + 'cases.php?Method=saveNewCase&UserEmail=' + this.Globals.CurrentUser.UserEmail + '&UserPassword=' + this.Globals.CurrentUser.UserPassword + '&CaseUniqueCode=' + Case.CaseUniqueCode + '&CaseTitle=' + Case.CaseTitle  + '&CreatorUserid=' + Case.CreatorUserid + '&CaseBriefDesc=' + Case.CaseBriefDesc).map(
        result => {
            let data = result.json()
            return data
        }
    ) 
}

updateCase(Case: Case){
    console.log(this.Settings.ApiURL + 'cases.php?Method=updateCase&UserEmail=' + this.Globals.CurrentUser.UserEmail + '&UserPassword=' + this.Globals.CurrentUser.UserPassword + '&CaseID=' + Case.CaseID + '&CaseUniqueCode=' + Case.CaseUniqueCode + '&CaseTitle=' + Case.CaseTitle  + '&CreatorUserid=' + Case.CreatorUserid + '&CaseBriefDesc=' + Case.CaseBriefDesc)

    return this._http.get(this.Settings.ApiURL + 'cases.php?Method=updateCase&UserEmail=' + this.Globals.CurrentUser.UserEmail + '&UserPassword=' + this.Globals.CurrentUser.UserPassword + '&CaseID=' + Case.CaseID + '&CaseUniqueCode=' + Case.CaseUniqueCode + '&CaseTitle=' + Case.CaseTitle  + '&CreatorUserid=' + Case.CreatorUserid + '&CaseBriefDesc=' + Case.CaseBriefDesc).map(
        result => {
            let data = result.json()
            return data
        }
    ) 
}



}

扩展错误...

defaultErrorLogger  @   core.es5.js:1085
ErrorHandler.handleError    @   core.es5.js:1145
next    @   core.es5.js:4774
schedulerFn @   core.es5.js:3848
SafeSubscriber.__tryOrUnsub @   Subscriber.js:234
SafeSubscriber.next @   Subscriber.js:183
Subscriber._next    @   Subscriber.js:125
Subscriber.next @   Subscriber.js:89
Subject.next    @   Subject.js:55
EventEmitter.emit   @   core.es5.js:3834
NgZone.triggerError @   core.es5.js:4205
onHandleError   @   core.es5.js:4166
ZoneDelegate.handleError    @   zone.js:338
Zone.runGuarded @   zone.js:142
_loop_1 @   zone.js:557
drainMicroTaskQueue @   zone.js:566
ZoneTask.invoke @   zone.js:424

最佳答案

当然我不介意得到一些分数:)。请在 app.module.ts 的提供者部分包含服务 CaseService

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [CaseService],
  bootstrap: [AppComponent]
})
export class AppModule { }

关于Angular4 - ZoneAwareError，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43108195/

文章推荐： node.js - s3 云端应用代码 : NoSuchKey on refreshing

文章推荐： javascript - Angular 路由错误 : should only include this file once

文章推荐： html - Angular 2 限制在控件上触发的事件或 Action 的数量

Angular4 - ZoneAwareError
当我尝试运行看起来像这样的 Angular4 时，我突然看到一个错误... ERROR ZoneAwareError {__zone_symbol__error: Error: Uncaught (i
angular - 如何 "unwrap"ZoneAwareError？
在我的 Angular 2 应用程序中，我有一个 resolve guard，它尝试 xhr 并在失败时抛出自定义错误: return this.service.getProduct (id)
Angular2 Karma Phantom-JS ZoneAwareError
我是 TypeScript/JavaScript 和 Angular2 的新手。我正在尝试为可以作为 VSTS 构建管道的一部分运行的 Angular2 应用程序设置单元测试框架。这个想法是在 pha
javascript - 教程中的 Angular 2 ZoneAwareError，但仅适用于 chrome
您好，感谢您的帮助!我正在进行英雄的 Angular 教程之旅，我已经结束了这一点4.Multiples Components ，但内容未加载(我们看到“正在此处加载 AppComponent 内容.
node.js - 集成 angular2-onsenui 时出现 ZoneAwareError
做了 npm install angular2-onsenui@latest --save npm install onsenui@2.2.x --save npm install process@0
angular - 模块 'undefined' 在 SyntaxError.ZoneAwareError 声明的意外值 'AppModule'
当我使用 npm 版本 4.6.1 运行我的 angular 2 应用程序时，出现以下错误。我的 ng build 和 gulp 在项目上运行良好。任何评论/帮助表示赞赏。谢谢。 @angular/c
angular - 错误 : Unexpected value 'Http' imported by the module 'AppModule' at SyntaxError. ZoneAwareError
我已经多次检查我的代码并尝试在网络和 stackoverflow 上找到类似的问题，但我现在已经没有想法了，我根本看不出我的错误。您对我接下来应该检查的内容有什么建议吗？更新:当我调试我的配置类时，

太空狗

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

Angular4 - ZoneAwareError