使用angular 4订阅的行为主题

时间:2018-07-08 02:15:59

标签: javascript angular typescript

我正在使用可观察的角度4。

我需要将一个组件的数据共享给另一个组件,因为我使用的行为对象具有可观察性。

这是我的代码

import { Subject } from 'rxjs/Subject';
import { Observable } from 'rxjs/Rx';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { Http, Response } from '@angular/http';

public _searchResultOne = new Subject<any>();
searchResultOne$ = this._searchResultOne.asObservable();


constructor(private http: Http) {}

newsearch() {
    return Observable.forkJoin(
        this.http.get(API),
        this.http.get(API)
    )
        .subscribe(latestValues => {
            const [data_changes, data_all] = latestValues;
            this._searchResultOne.next(latestValues);
        })
}

getNewSearchResults(): Observable < any > {
    return this.searchResultOne$;
}

实际上我显示的数据负载更多。使用此函数getNewSearchResults()获取结果。

这是我的组成部分。

import { SearchService } from '../../shared/services/search.service';
import { ISubscription } from 'rxjs/Subscription';

results;

constructor(
    public searchService: SearchService) {

}
ngOnInit() {
    this.searchOne();
}
searchOne() {
    this.subscription = this.searchService
        .getNewSearchResults()
        .subscribe(res => {
            console.log("result", res);
            var freelisting = res[1].response.docs;
            this.results = this.results.concat(this.freelisitingArray);
        }
}

我只是安慰响应。它多次被调用。为什么?

结果已被多次订阅,所以我得到重复的结果。如何避免多次订阅。

我也尝试用this.subscription.unsubscribe()进行ngOnDestroy。但是我仍然得到了更多重复的结果。

我该如何解决此问题。

请劝我

谢谢。

1 个答案:

答案 0 :(得分:0)

似乎您正在尝试使用单例服务在两个(或更多)组件之间共享它。如果是这种情况,请在provider: [SearchService]部分中查看您的模块代码,您必须从组件中删除此提供程序,并仅将其中一个添加到 app.module.ts.中。您将只有该服务的一个实例,并且在两个组件中保留相同的值。