forkJoin在两个输入上

时间:2017-12-30 17:35:11

标签: javascript angular typescript rxjs

我有两个输入字段,街道地址 Zipcode ,每个输入字段都会在主题上将其作为主题(Angular的事件发射器)发出。

我希望在使用它们调用API端点之前让两个发射器值都有效。

首先观察,街道地址

this.searchableComponent.value
            .do((value: any) => {
                if (value.length < this.MINIMAL_LENGTH_FOR_SEARCH) {
                    this.suggestions = [];
                }
            })
            .filter(() => this._zipcodeModel !== undefined && this._zipcodeModel.city.length > 0)
            .filter((value: any) => value.length >= this.MINIMAL_LENGTH_FOR_SEARCH)
            .debounceTime(this.DEBOUNCE_TIME_IN_MS)
            .distinctUntilChanged()
            .do(() => console.log('ready street address'))

第二个可观察的邮政编码

this.zipcodeInput.value
        .filter((value: string) => {
            const pattern = new RegExp(US_ZIPCODE);

            return pattern.test(value);
        })
        .distinctUntilChanged()
        .mergeMap((zipcode: string) => this.addressService.lookup(zipcode))
        .map((zipcodeModel: ZipcodeModel) => this._zipcodeModel = zipcodeModel)
        .do(() => console.log('ready zipcode'))

要测试的简单forkJoin(与combineLatest尝试相同的实现):

forkJoin(this.searchableComponent.value, this.zipcodeInput.value)
            .subscribe((results: any) => {
                console.log(results)
            })

我尝试在两个observable上使用forkJoin,尽管它们中没有一个可以发出任何东西。 在第一个observable有效并完成后尝试使用combineLatest时,它们的组合在第二个可观察的每个发射上完成,即使它是无效的。

完成所有观察者后,完成多个观察者的正确方法是什么?

1 个答案:

答案 0 :(得分:0)

我使用withLatestFrom找到了解决方案。

通过将.withLatestFrom(this.zipcodeInput.value)添加到可观察的街道地址,我设法创建了我想要的依赖项。

仍然无法理解为什么forkJoin没有做到这一点。