Как предотвратить несколько звонков на одну и ту же конечную точку - PullRequest
0 голосов
/ 30 января 2019

Я вызываю метод loadParticipant два раза в двух отдельных компонентах, он выполняется почти одновременно, несмотря на сохранение Observable в переменной, api вызывается несколько раз.Это решение работало в вызовах AngularJs и Promises, но теперь, конечно, я хочу использовать Observables:)

Я пытался добавить debouncetime и поделиться параметрами после map

return (this.loadParticipantObservable = this.sharedEndpoints.getParticipant().map((response) => {
    this.loadParticipantObservable = null;
    return (this.participant = response);
})).share().debounceTime(1000);

фактический код метода loadParticipant

public loadParticipant(): Observable<DTO<PersonModel>> {
    if (this.participant) {
        return new BehaviorSubject<DTO<PersonModel>>(this.participant);
    }

    if (this.loadParticipantObservable) {
        return this.loadParticipantObservable;
    }

    return (this.loadParticipantObservable = 
        this.sharedEndpoints.getParticipant().map((response) => {
            this.loadParticipantObservable = null;
            return (this.participant = response);
        }));
    }

пример Как я вызываю метод loadParticipant

this.sharedService.loadParticipant().subscribe((response: DTO<PersonModel>) => {
            ...
     });

В то же время Observable не равен NULL, код входит в это условие и выполняет

 return this.loadParticipantObservable;

Я проверил это в отладчике.

Это возвращает меня, только наблюдаемый, но, к сожалению, этот код вызывает код ниже этого возврата, который вызывает реальную конечную точку из бэкэнда

1 Ответ

0 голосов
/ 31 января 2019

если бы я был на вашем месте, я бы попытался разделить выборку и , визуализирующую логику, на две части, другими словами, сервис с двумя методами:

  • methodI Для извлечения и сохранения данных на клиенте (в переменной внутри службы) из внутреннего интерфейса

  • methodII Для полученияданные (из упомянутой переменной) в компонентах, для которых они необходимы

После этого я подпишусь на метод II, где бы мне ни понадобилось визуализировать нужные данные, позвоню на сервер в ближайший общий родительский компонент .

Взгляните на это rxjs demo CodeSandbox , я думаю, это поможет вам понять, чтоЯ говорю о:)

** Примечание: если вы можете себе это позволить, перейдите на rxjs 5.5+, потому что вы сможете использовать конвейерные операторы, что дает некоторые преимущества, вы можете проверить это напо теме: Трубные операторыe

** Примечание 2: Если вы работаете над проектом среднего или большего размера, проверьте ngrx, поскольку при использовании ngrx все головные боли, связанные с вызовами сервера и управлением состоянием пользовательского интерфейса, исчезнут.

...