淺談Angular 觀(guān)察者模式理解
更新時(shí)間：2018年11月01日 10:16:56 作者：潘佳琦
這篇文章主要介紹了淺談Angular 觀(guān)察者模式理解，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
觀(guān)察者模式意圖
定義對(duì)象間的一種一對(duì)多的依賴(lài)關(guān)系，當(dāng)一個(gè)對(duì)象的狀態(tài)發(fā)生改變時(shí)，所有依賴(lài)于它的對(duì)象都得到通知并被自動(dòng)更新。
實(shí)現(xiàn)過(guò)程
在老師教程中學(xué)到了 Angularjs 中的觀(guān)察者模式
不使用觀(guān)察者模式，登錄時(shí)不實(shí)時(shí)獲取當(dāng)前登錄用戶(hù)，必須刷新界面
使用觀(guān)察者模式
代碼
Services：
// 觀(guān)察者
self.observerCallbacks = [];
// 注冊(cè)觀(guān)察者
self.reisterObserverCallback = function(callback){
self.observerCallbacks.push(callback);
};
// 通知觀(guān)察者
self.notifyObserver = function(currentLoginTeacher){
angular.forEach(self.observerCallbacks, function(callback){
callback(currentLoginTeacher);
});
};
Controller:
// 注冊(cè)觀(guān)察者
teacher.reisterObserverCallback(function(teacher){
$scope.data.CurrentLoginTeacher = teacher;
});
使用時(shí)調(diào)用self.notifyObserver方法。只要是注冊(cè)過(guò)的觀(guān)察者都會(huì)得到一個(gè)通知。
時(shí)序圖
總結(jié)
觀(guān)察者模式：我覺(jué)得用一個(gè)詞來(lái)總結(jié)，就是群發(fā)。
當(dāng)一個(gè)對(duì)象發(fā)生改變的同時(shí)，需要其他對(duì)象也改變，但是并不知道具體有多少個(gè)對(duì)象改變。
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
詳解AngularJS中module模塊的導(dǎo)入導(dǎo)出
本文給大家介紹angularjs中module模塊的導(dǎo)入導(dǎo)出，涉及到angularjs module相關(guān)知識(shí)，對(duì)angularjs module感興趣的朋友一起看看吧2015-12-12
Angular網(wǎng)絡(luò)請(qǐng)求的封裝方法
本篇文章主要介紹了Angular網(wǎng)絡(luò)請(qǐng)求的封裝方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-05-05
Angularjs 實(shí)現(xiàn)動(dòng)態(tài)添加控件功能
這篇文章主要介紹了Angularjs 實(shí)現(xiàn)動(dòng)態(tài)添加控件功能,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2017-05-05
angularjs使用div模擬textarea文本框的方法
今天小編就為大家分享一篇angularjs使用div模擬textarea文本框的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-10-10
Angular2平滑升級(jí)到Angular4的步驟詳解
最近Angular項(xiàng)目組終于發(fā)布了新版——正式版 Angular 4.0.0。所以想著就來(lái)嘗試下升級(jí)，記錄下整個(gè)升級(jí)過(guò)程分享給大家，所以這篇文章主要介紹了Angular2升級(jí)到Angular4的詳細(xì)步驟，需要的朋友可以參考下。2017-03-03
淺談angular2的http請(qǐng)求返回結(jié)果的subcribe注意事項(xiàng)
下面小編就為大家?guī)?lái)一篇淺談angular2的http請(qǐng)求返回結(jié)果的subcribe注意事項(xiàng)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-03-03
Angular 實(shí)現(xiàn)輸入框中顯示文章標(biāo)簽的實(shí)例代碼
這篇文章主要介紹了Angular 實(shí)現(xiàn)輸入框中顯示文章標(biāo)簽的實(shí)例代碼，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-11-11
詳解ionic本地相冊(cè)、拍照、裁剪、上傳（單圖完全版）
本篇文章主要介紹了ionic本地相冊(cè)、拍照、裁剪、上傳（單圖完全版），非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-10-10
這篇文章主要介紹了Angular PWA使用的Demo示例，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-01-01
這篇文章主要介紹了AngularJS中scope的綁定策略,結(jié)合實(shí)例形式簡(jiǎn)單分析了AngularJS scope的三種綁定模式的使用方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下2017-10-10