Angular2 Karma测试说“TypeError:this._subscribe不是函数”

时间:2017-02-08 03:55:51

标签: angular karma-jasmine observable

到目前为止,我有一个Angular 2应用程序。 My GlobalsService.getGlobals()通过我的OptionService.getOptions()获取“USA States”。我的代码落在了Karma / Jasmine测试中。

当我在当前的测试设置中调用getGlobals()时,我得到“this._subscribe不是函数”错误。我发现很难调试这个,因为Google Chrome不合作。

添加了调试的getGlobals()代码。我在getOptions()和.subscribe()之间拆分代码,看看发生了什么。

public getGlobals(): void {
  let asdf = this.optionService.getOptions();

  console.log("asdf is " + (typeof asdf) + ", asdf.subscribe is: " + asdf.subscribe);
  try {
    asdf.subscribe(
      (options: Option[]) => this.fillOptions(options),
      (error: string) => this.error = error
    );
  } catch(error) {
    console.log("caught error involving asdf, it is: " + error);
    throw error;
  }
}

当我运行此代码时,我得到:

 LOG: 'asdf is object, asdf.subscribe is: function (observerOrNext, error, complete) {
[1]         var operator = this.operator;
[1]         var sink = toSubscriber_1.toSubscriber(observerOrNext, error, complete);
[1]         if (operator) {
[1]             operator.call(sink, this.source);
[1]         }
[1]         else {
[1]             sink.add(this._subscribe(sink));
[1]         }
[1]         if (sink.syncErrorThrowable) {
[1]             sink.syncErrorThrowable = false;
[1]             if (sink.syncErrorThrown) {
[1]                 throw sink.syncErrorValue;
[1]             }
[1]         }
[1]         return sink;
[1]     }'

asdf.subscribe的代码是你从node_modules / rxjs / Observable.js看到的。所以getOptions()的返回是一个Observable。在众多属性中,它具有以下特征:

_subscribe: Array[4] (each item is an Object of my Option data type)
_proto_: Object
  _subscribe: (subscriber) 
  subscribe: (observer or next, error, complete)

但如果我让代码继续,我就会收到错误。在asdf变量的地方“this”是GlobalsService。

我的模拟OptionService代码是:

@Injectable()
export class MockOptionService {
  constructor() { }

  getOptions(): Observable<Option[]> {
    let options: Option[] = [
      { id: 'IN', name: 'Indiana', topic: Option.TOPIC_STATE },
      { id: 'NJ', name: 'New Jersey', topic: Option.TOPIC_STATE },
      { id: 'CONCERT', name: "Concert", topic: Option.TOPIC_EVENT_TYPE },
      { id: 'NY', name: 'New York', topic: Option.TOPIC_STATE }
    ];
    return Observable.create(options);
  }

}

这是通过以下方式注入的:

describe('Globals Service', () => {

  beforeEach(() => {

    TestBed.configureTestingModule({
      providers: [
        { provide: OptionService, useClass: MockOptionService },
        { provide: GlobalsService, useClass: GlobalsService }
      ]
    });
[SNIP]

});

正如我所说,我在调试时遇到了Chrome问题。如果我在调试器中显示Observable.js源并尝试设置断点,浏览器将显示不存在的Observable.ts文件的空白页。断点不会在任何一个地方显示。代码停止在不存在的Observable.ts:92上。

我的问题是:

1。我可以说服Chrome在Typescript世界中给我一个Javascript断点吗?

2。创建对象数组然后将其附加到Observable的正确功能是什么?我怀疑Observable.create()是错误的。

谢谢, 杰罗姆。

1 个答案:

答案 0 :(得分:6)

请改用Observable.ofObservable.create期望订阅功能。 for i in range(0, len(arr), 8): print(' '.join('{:<8}'.format(item) for item in arr[i:i+8])) 旨在用于创建&#34;自定义逻辑&#34; # Output 10816 4469632 17280 17921984 17280 17921984 10816 4469632 9280 4722112 12992 10511552 12992 10511552 9280 4722112 5056 2677440 7552 700992 7552 6700992 5056 2677440 23552 2163648 42368 60456192 42368 60456192 23552 2163648 1792 1720896 2112 891264 2112 891264 1792 1720896 3008 1517568 4736 4261568 4736 4261568 3008 1517568 2624 284224 1856 501568 1856 501568 2624 284224 576 53184 512 452160 512 452160 576 53184 2880 204160 2816 3121792 2816 3121792 2880 204160 ,而Observable.create只创建一个基本Observable,它会发出您传递给它的值。