angular - เรียกฟังก์ชันทุก ๆ 10 วินาที Angular2

ฉันกำลังพยายามสร้าง Timer ที่เรียก API call ทุก 10 วินาที ฉันใช้ setTimeOut แต่ปัญหาคือมันกลายเป็นลูปไม่สิ้นสุด และแม้ว่าฉันจะไปยังหน้าอื่น มันก็ยังคงเข้าร่วมเงื่อนไข if

ตัวอย่าง :

ฉันเรียกใช้วิธีนี้เพื่อเริ่มการเรียก API เป็นเวลา 10 วินาที

setTimeout(() => {
    this.onTimeOut();
}, 1000);

และนี่คือเมธอด onTimeOut()...

onTimeOut() {
    this.ApiCall().then(
    success => {
    if(success ['ok'] == 0){
        this.navCtrl.push(myPage);
    }
    },
    error => { console.log(error); });
}
setTimeout(() => {
    this.onTimeOut();
}, 1000);
}

ฉันเคยได้ยินเกี่ยวกับ Debounce และ rxjs/rs แต่ฉันไม่คุ้นเคยกับมัน คุณช่วยให้คำแนะนำหน่อยได้ไหมว่าจะทำแบบเดียวกันนี้ได้อย่างไร? หรือถ้าวิธีนี้มีประสิทธิภาพมากกว่าก็โปรดอธิบายให้ฉันฟังว่าทำไมมันถึงกลายเป็นลูป

เป้าหมายคือเมื่อต่อกับ if และกดหน้าจะหยุดตัวจับเวลา

คำตอบ #1

ควรใช้ observables จะดีกว่า

this.sub = Observable.interval(10000)
    .subscribe((val) => { console.log('called'); });

เพื่อหยุดมัน ใช้

this.sub.unsubscribe();

ตรวจสอบให้แน่ใจว่าได้นำเข้า interval ด้วย

import 'rxjs/add/observable/interval';

คำตอบ #2

จาก RxJS 6+ คุณเพียงแค่ใช้ interval.

import { interval } from 'rxjs';

//in 10 seconds do something
interval(10000).subscribe(x => {
    this.myFunctionThatDoesStuff();
});

คุณสามารถใช้ Subscription กับช่วงเวลาได้

import { interval, Subscription} from 'rxjs';
export class intervalDemo{
    mySubscription: Subscription

    constructor(){
    this.mySubscription= interval(5000).subscribe((x =>{
                this.doStuff();
            }));
    }
    doStuff(){
        //doing stuff with unsubscribe at end to only run once
        this.failedRequestSub.unsubscribe();
    }
}

คำตอบ #3

วิธีแก้ปัญหาที่ดีกว่าการใช้ setTimeout ในแอป Angular อาจเป็นการใช้ Observable Observable มีเมธอดที่ชื่อว่า timer ที่คุณสามารถใช้ได้ในลักษณะนี้ (และมี TimerObservable ด้วยแต่ผมไม่เคยใช้มันเลยจึงไม่รู้ว่ามันเหมือนกันหรือไม่):

timer = Observable.timer(initialDelay, period);

timer.subscribe(tick => {
   // Your API call, which will be performed every period
});

ฉันสนับสนุนให้คุณใช้ RxJS และ Observable สำหรับคำร้องของคุณด้วย แทนที่จะใช้ promises มันดูเหมือนวิธีที่ Angular จะทำสิ่งต่าง ๆ สำหรับฉัน และ RxJS เป็นไลบรารีที่ทรงพลังจริงๆ

เอกสาร RxJS Observable