AskiLD
@AskiLD
Angular frontend developer

Как подписаться на изменение переменной и выполнить вызов функции один раз для последнего элемента?

В html при клике по div изменяется переменная и каждый раз при изменении вызывается запрос на сервер. Как сделать так чтобы запрос на сервер отправлялся только один раз? Например, кликаю 10 раз - а вызов только один по текущему (последнему) значению. Сейчас вызов на сервер 10 раз, хотя переменная - нужная мне.

html:
<div class="btn btn-mmk-color" 
                          id="next" 
                          mwlCalendarNextView [view]="view" 
                          [(viewDate)]="viewDate"
                          (click)="activeDayisOpenFalse();" 
                    >
                      <i id="next2"   class="fas fa-angle-double-right"></i>
                  </div>

component.ts:
time$ : BehaviorSubject<number> = new BehaviorSubject(0);



activeDayisOpenFalse() {
    console.log('click');
    this.activeDayIsOpen = false;
    
    /*this.getCalendar();
    */
   
    this.time$.next(this.viewDate.getMonth() + 1 );

    this.time$.subscribe(
      (v)=> {console.log(v)} // здесь логи выводятся 10 раз, хочу сюда вызов на сервер поставить
      
    )
}
  • Вопрос задан
  • 122 просмотра
Пригласить эксперта
Ответы на вопрос 2
lssssssssssl
@lssssssssssl
https://www.learnrxjs.io/learn-rxjs/operators/tran...

Если кликаете 10 раз, должно уходить 10 запросов. Вопрос только в том, что, вероятно, первые 9 результатов вам будут уже не нужны. И как раз switchMap в этом поможет.

Но если вам принципиально нужно, чтобы нельзя было 10 раз тыкать, вешайте disabled на кнопку, пока не придёт результат первого клика.
Ответ написан
@kttotto
пофиг на чем писать
Зависит от того, что такое "последний клик" и как Вы определяете, что он последний. Если имеете в виду, что можно быстро кликнуть несколько раз по элементу и на каждый клик срабатывает отправка, а надо, чтобы только один раз, после "последнего клика в группе быстрых кликов", то для этого есть оператор https://rxjs.dev/api/operators/debounce. Событие пройдет только когда после клика пройдет заданное время. Например, это используется при наборе в поисковой строке: нам не нужен запрос на ввод каждой буквы (а набирают быстро), будет выжидаться пауза между набором символов, как только она появится, произойдет запрос.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы