Resolver Emitting Error ` ERROR Error: "[object Object]" `

Resolver Emitting Error ` ERROR Error: "[object Object]" `

我在我的路由上实现解析器时遇到问题,因为在我将 InitialDataResolver 包含在我的路由模块中之前它没有问题。

pages-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { FrontComponent } from '../layouts/front/front.component';
import { HomeComponent } from './home/home.component';
import { DocsComponent } from './docs/docs.component';
import { InitialDataResolver } from './../shared/resolvers/initial-data.resolver';

const routes: Routes = [
  {
    path: '',
    component: FrontComponent,
    children: [
      { path: '', component: HomeComponent },
      { path: 'docs', component: DocsComponent }
    ],
    resolve: {
      init: InitialDataResolver
    },
  }
];

@NgModule({
  imports: [ RouterModule.forChild(routes) ],
  exports: [ RouterModule ],
  providers: [ InitialDataResolver ]
})
export class PagesRoutingModule { }

initial-data.resolver.ts

import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, Resolve, RouterStateSnapshot } from '@angular/router';
import { Observer } from 'rxjs/Observer';
import { AppInitService } from '../services/app-init.service';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class InitialDataResolver implements Resolve<any> {

  constructor(private appInitService: AppInitService) {}

  resolve(route: ActivatedRouteSnapshot,
          state: RouterStateSnapshot): Observable<any> {
    return Observable.create((observer: Observer<any>) => {

      this.appInitService.init()
          .subscribe(data => {
            this.appInitService.preload();
            observer.next(data);
            observer.complete();
          });

    });
  }

}

我遇到的错误是 ERROR Error: "[object Object]"。请参阅下面的快照:

resolve(route: ActivatedRouteSnapshot,
      state: RouterStateSnapshot): Observable<any> {
    return Observable.create((observer: Observer<any>) => {

      this.appInitService.init()
          .subscribe(data => {
            this.appInitService.preload();
            observer.next(data);
            observer.complete();
          });

    }).map(item => !!item)
}

上面的代码对你有用。

如果你的 rxjs 版本是 6.x 你将使用 .pipe(map(item => !!item))

使用 Mozilla Firefox 时出现缺少详细信息的错误。所以你需要做的是切换到 Google Chrome 来查看具体的错误。

更新:

您也可以将错误存储为全局变量

然后您可以键入 temp0.message 以查看实际的错误消息

此错误是由于错误的路由器声明引起的。 Firefox 也永远不会出现确切的错误。检查 chrome 中的路由文件。 #angularjs-路线

如果您在 Web 服务器上构建时没有使用 --prod 和主机,则该错误可能会隐藏有关 firefox 的详细信息;如果您在 Web 服务器上托管,请尝试使用 --prod 进行构建以获取有关错误的详细信息。

一次性解决方案: 在 dist/vendor.bundle.js 中找到函数 defaultErrorLogger 并添加:

for (var _i = 1; _i < arguments.length; _i++) {
    values[_i - 1] = arguments[_i];
}
console.log(arguments);
console.error.apply(console, values); code here

然后刷新页面而不用重新编译

我找到了在 firefox 中工作时出现详细错误的解决方案。它基于定义自定义错误处理程序和自己检查错误属性。 经过这些步骤,错误显示正常,无需切换到 chrome.

  1. 定义自定义错误处理程序class:
import { ErrorHandler } from '@angular/core'

export class MyErrorHandler implements ErrorHandler {

    handleError(error: any) {
        // console.error(Object.getOwnPropertyNames(error))
        // Object.getOwnPropertyNames(error).forEach(p => console.error(error[p]))
        console.error(error.fileName, error.lineNumber, ':', error.columnNumber, '\n', error.message, error.rejection)
    }

}
  1. 然后在主组件中注册为provider
@NgModule({
    declarations: []
    imports: []
    providers: [{provide: ErrorHandler, useClass: MyErrorHandler}], // <-- register MyErrorHandler
    bootstrap: [RootComponent]
})
export class AppModule { }

这个错误主要是在使用来自'@angular/fire'的数据库对象时发现的

这可以通过使用 this.db.object('/' + ....).subscribe(...)

来解决

在控制台中,您可以存储类似

的错误

ERROR Error: "[object Object]"

作为全局变量

然后从对象 temp0.message

获取错误信息