如何提供一个Rxjs observable作为使用Jasmine中的combineLatest的方法的数据

Posted 2021-04-06

我目前有一个combineLatest方法，我通过我的班级提供：

export class ObservableDataSource extends DataSource<any> {
  private value: any[];
  private key: string;
  constructor(value: any[], key) {
    super();
    this.value = value;
    this.key = key;
  }

  connect() {
    //Code related to question starts here
    return combineLatest(this.value, (data) => {
      return data[this.key];
    });
    //Code related to question ends here
  }

  disconnect() {} 
}

在我的单元测试中，我有一个beforeEach，我用来实例化组件并提供一个observable：

const dummyData = [{
  visible: {
    data: 'test123'
  }
}];
const observableDummyData = Observable.of([dummyData]);
beforeEach(() => {
TestBed.configureTestingModule({
  providers: [
    {provide: ObservableDataSource, useValue: new ObservableDataSource(observableDummyData, 'visible')}
  ]
});
});

  it('should be created', inject([ObservableDataSource], (service: ObservableDataSource) => {
    expect(service).toBeTruthy();
  }));

唯一的问题是，当查看控制台的业力转轮时，而this.value显示为可观察的，从combineLatest中发出的数据显示为空的TypeError: Cannot read property 'visible' of undefined。可能的原因：

1. 我向Observable.of提供错误的数据
2. 我正在以错误的方式创建一个observable（我不应该使用observable.of）。
3. 我有一个我需要调用的发射器，以便将可观察的数据传递给combineLatest。
4. 我没有发现的原因

任何建议，都非常感谢。谢谢。

答案

我认为您的代码中存在多个问题。

1.您的服务期望其value参数是一个数组，但您提供的是一个简单的Observable。

2 combineLatest使用多个可观察参数，而不是参数数组。

return combineLatest(obsA, obsB, obsC, (a, b, c) => { ... });

// or with the spreading operator
return combineLatest(...arrayOfObs).map((...data) => { ... });

代码示例（未测试）

Dummy data

const dummyData1 = [{
  visible: {
    data: 'test123'
  }
}];

const dummyData2 = [{
  visible: {
    data: 'somethingElse'
  }
}];


const observableDummyData = [
  Observable.of(dummyData1),
  Observable.of(dummyData2),
];

combineLatest

见documentation for spreading operator

connect() {
    return combineLatest(...this.value).pipe(
        map(...data) => {
            return data[this.key]
        }
    );
  }