本篇文章帶大家了解一下Angular 可觀察對象(Observable)。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有所幫助。

可觀察對象(Observable)
可觀察對象支持在應用的發布者和訂閱者之間傳遞消息。
可觀察對象是聲明式的 —— 即定義的用于發布值的函數,在有消費者訂閱它之前,這個函數不會實際執行。
可觀察對象可能會發出的三種通知:
| 通知類型 | 說明 |
|---|---|
| next | 必要。用來處理每個送達值。在開始執行后可能執行零次或多次。 |
| error | 可選。用來處理錯誤通知。錯誤會中斷這個可觀察對象實例的執行過程。 |
| complete | 可選。用來處理執行完畢(complete)通知。當執行完畢后,這些值就會繼續傳給下一個處理器。 |
定義觀察者
觀察者(observer): 用于接收可觀察對象通知的處理器要實現 Observer 接口,這個對象定義了一些回調函數來處理可觀察對象可能會發來的三種通知。
觀察者對象可以定義這三種處理器的任意組合。如果你不為某種通知類型提供處理器,這個觀察者就會忽略相應類型的通知。
// Create observer object
const myObserver = {
next: (_data) => {
// next通知類型處理器
},
error: err => {
// error通知類型處理器
},
complete: () => console.log('Observer got a complete notification'),
};訂閱
只有當Observable的實例被訂閱時,Observable實例才會發布值。訂閱時要先調用該實例的subscribe() 方法,并把一個觀察者對象傳給它,用來接收通知。
語法:Observable.subscribe(ObserverObject),其中,Observable為可觀察對象實例,ObserverObject為觀察者對象。
// 官網示例
// Create simple observable that emits three values
const myObservable = of(1, 2, 3);
// Create observer object
const myObserver = {
next: x => console.log('Observer got a next value: ' + x),
error: err => console.error('Observer got an error: ' + err),
complete: () => console.log('Observer got a complete notification'),
};
// Execute with the observer object
myObservable.subscribe(myObserver);
// Logs:
// Observer got a next value: 1
// Observer got a next value: 2
// Observer got a next value: 3
// Observer got a complete notification另外,subscribe() 方法還可以接收定義在同一行中的回調函數,無論 next、error 還是 complete 處理器。比如,下面的 subscribe() 調用和前面指定預定義觀察者的例子是等價的。
myObservable.subscribe(
x => console.log('Observer got a next value: ' + x),
err => console.error('Observer got an error: ' + err),
() => console.log('Observer got a complete notification')
);注: 無論哪種情況,next通知類型的處理器是必要的,而error和complete處理器是可選的。
subscribe() 調用會返回一個 Subscription 對象,該對象具有一個 unsubscribe()方法。 當調用該方法時,你就會停止接收通知。






