Question

在创建自定义调试时遇到了一个问题

我遵循了进行自定义调试的教程，下面是代码

import {Observable} from 'rxjs/index';
import {environment} from '../../environments/environment';

declare module 'rxjs/internal/Observable' {
  interface Observable<T> {
    debug: (...any) => Observable<T>;
  }
}

Observable.prototype.debug = (message: string) => {
  return this.do(
    (next) => {
      if (!environment.production) {
        console.log(message, next);
      }
    },
    (err) => {
      if (!environment.production) {
        console.error('ERROR >>', message, err);
      }
    },
    () => {
      if (!environment.production) {
        console.log('Completed - ');
      }
    }
  );
};

当我在服务中使用调试时，它给了我这个错误

this.httpClient.get（...）。pipe（...）。debug不是函数在QuoteService.push ../ src / app / services / quote.service.ts.QuoteService.getQuote（quote.service.ts：19）

export class QuoteService {

  constructor(@Inject('BASE_CONFIG') private config,
              private httpClient: HttpClient) { }

  getQuote(): Observable<Quote> {
    const uri = `${this.config.uri}/quotes/${Math.floor(Math.random() * 10)}`;
    return this.httpClient.get(uri)
      .pipe(map((res: Quote) => res as Quote))
      .debug('quote: ');
  }
}

当我将调试包装在pipe（）中时，它只是说

错误ReferenceError：未定义调试

我不知道如何解决这个问题，有人知道吗？

感谢任何评论

Answer 1

上面进行调试的方法来自Angular 4，在Angular 6中，我提出了一种更清晰，更简单的方法

查看代码：

WhWidgetSendButton = new WhWidgetSendButton()

然后可以通过在管道运算符中进行链接来在任何需要的地方使用

import {pipe} from 'rxjs/index';
import {environment} from '../../environments/environment';
import {tap} from 'rxjs/internal/operators';

export const debug = (message: string) => pipe(
  tap(
    (next) => {
      if (!environment.production) {
        console.log(message, next);
      }
    },
    (err) => {
      if (!environment.production) {
        console.error('ERROR >>', message, err);
      }
    },
    () => {
      if (!environment.production) {
        console.log('Completed - ');
      }
    }
  )
);

就这么简单

Angular 6如何在Angular Observable中定义自定义调试功能

1 个答案: