Как обновлять данные sh на странице каждые 1 час, и когда вкладка получает фокус в Angular - PullRequest
Новая
       60

Как обновлять данные sh на странице каждые 1 час, и когда вкладка получает фокус в Angular

0 голосов
/ 02 февраля 2020

Мне удалось внедрить авторефрейму sh каждый час в Angular, используя interval и Subscription.

Вот код: 

ngOnInit() {

   const source = interval(3600000); // Refresh Every 1 hour 
   this.subscription = source.subscribe(val => this.fetchNewData());

}


fetchNewData () {

    // Fetch New data and bind it to the View
}

Для реализации на вкладке я использовал следующий код: 

@HostListener('window:focus')
onFocus(event: FocusEvent): void {
   this.fetchNewData()
}

Проблема в том, что метод onFocus срабатывает только тогда, когда я делаю событие клика на веб-странице. Как обнаружить onFocus без какого-либо клика пользователя по веб-странице?

1 Ответ

0 голосов
/ 02 февраля 2020

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

ngOnInit() {
     if (!local storage.getItem("pastTime") {
         startTime = getMilliSeconds(hrs, min, sec)
        local storage.setItem("pastTime", startTime)
     }
     interval = localStorage.getItem("pastTime") - getMilliSeconds(hrs, min, sec)
    setInterval(this.timeOut(), interval);
}

В функции timeOut, 

timeOut() {
    // Call your data
    localStorage.setItem("pastTime", getMilliSeconds(hrs, min, sec));
    // Changing your pastTime in above statement. Since, you want to continue it every one hour. 
    interval = localStorage.getItem("pastTime") - getMilliSeconds(hrs, min, sec)
    setInterval(this.timeOut(), interval);
}

Чтобы получить, миллисекунды: 

getMilliSeconds (hrs, min, sec) {
    return((hrs*60*60+min*60+sec)*1000);
}

Надеюсь, вы поняли, что происходит. При инициализации мы впервые установим значение локального хранилища. И каждый раз мы будем выполнять разницу между значением локального хранилища и текущим временем. И эта разница отправляется в setInterval (). Как только вы вызываете timeOut (), мы снова устанавливаем pastTime в локальном хранилище и, следовательно, устанавливаем setInterval (). У меня нет компьютера на данный момент со мной. Итак, все это делается без компьютера. Если у вас возникнет какая-то проблема, она должна быть незначительной и решить ее.

...