延遲在Angular2

Question

路由器我有這樣的代碼，其中有2個功能： say()會播放音樂（實現和它的作品） 和router導致下一個頁面（它的工作原理也）

go_next() { 
    this.say(); // audio 
    this.router.navigate(['app'], { queryParams: { 'part': this.part+1 } }); //go to next page 
} 

但我想要做的是播放音樂（需要5秒），然後進入下一頁...我怎麼能實現這個？..我想，我必須實現某種delay，但我router.navigate找不到這樣的參數。

Answer 1

setTimeout（function，milliseconds）在等待 指定的毫秒數後執行函數。

go_next(){ 
    setTimeout(() => { 
     this.router.navigate(['app'], {queryParams: {'part': this.part + 1}}) 
     } 
     , 5000); 
} 

Answer 2

您可以RxJS的優勢來實現這一目標。通過使say()使用Observable.create返回可觀察值，只要它完全完成，就可以異步地發出一個值。在go_next()之內，您可以利用delay()等待任何時間，然後再根據subscribe()內的發射值進行操作。在這種情況下，從say()發出的值可以是任何東西，只需撥打next()即可發出某種價值。

這種模式可以讓你處理錯誤，並在必要時處理完成say（）的狀態，或者取決於如何構造say()，允許多個訂戶對其值/錯誤/完成作出反應。

say(): Observable<any> { 
    return Observable.create(observer => { 
    // some logic goes here 
    // emit value when completed 
    observer.next(true); 
    }); 
} 

go_next() { 
    this.say().delay(5000).subscribe(() => { 
     // this.router.navigate(['app'], { queryParams: { 'part': this.part+1 } }); 
    }); 
} 

這是演示功能的plunker。

希望有幫助！