使用Console.info.bind(Console)时的控制台日志对象

Question

我见过许多Angular2+开发人员使用console.info.bind(console)方法从javascript控制台记录器中创建记录器服务。然而，在我的实现中，我的所有javascript对象都作为[object object]注销。

如何调整我的记录器，以便在控制台中渲染我的对象？

控制台记录器服务.ts

import {Injectable} from '@angular/core';
import {environment} from '../../../environments/environment';
import {Logger} from './logger.service';
export let isDebugMode = environment.isDebugMode;
const noop = (): any => undefined;
@Injectable()
export class ConsoleLoggerService implements Logger {
get info() {
if (isDebugMode) {
return console.info.bind(console);
} else {
return noop;
}
}
get warn() {
if (isDebugMode) {
return console.warn.bind(console);
} else {
return noop;
}
}
}

Logger.Service.ts

import {Injectable} from '@angular/core';
export abstract class Logger {
info: any;
warn: any;
}
@Injectable()
export class LoggerService implements Logger {
info: any;
warn: any;
}

示例.组件.ts

import {Component, OnInit} from '@angular/core';
import {LoggerService} from 'src/app/core';

@Component({
selector: 'app-example-component',
templateUrl: 'example.component.html',
styles: ['example.component.scss']
})
export class ExampleComponent implements OnInit {
exampleObject: {a: 'apple'; b: 'banana'};
constructor(
private _logger: LoggerService,
) {
}
async ngOnInit() {
this._logger.info("Example Output: " + this.exampleObject);
// Example Output: [object object]
// ?? i want to see the actual object
}
}

Answer 1

如果你想在控制台中看到Object，你应该使用JSON.stringfy((

return console.info.bind(JSON.stringify(console));

Answer 2

玩了一段时间之后。我发现这给了我想要的。

this._logger.info('Example: ', this.exampleObject);