淺談Angular 觀察者模式理解
更新時(shí)間：2018年11月01日 10:16:56 作者：潘佳琦
這篇文章主要介紹了淺談Angular 觀察者模式理解，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
觀察者模式意圖
定義對象間的一種一對多的依賴關(guān)系，當(dāng)一個(gè)對象的狀態(tài)發(fā)生改變時(shí)，所有依賴于它的對象都得到通知并被自動更新。
實(shí)現(xiàn)過程
在老師教程中學(xué)到了 Angularjs 中的觀察者模式
不使用觀察者模式，登錄時(shí)不實(shí)時(shí)獲取當(dāng)前登錄用戶，必須刷新界面
使用觀察者模式
代碼
Services：
// 觀察者
self.observerCallbacks = [];
// 注冊觀察者
self.reisterObserverCallback = function(callback){
self.observerCallbacks.push(callback);
};
// 通知觀察者
self.notifyObserver = function(currentLoginTeacher){
angular.forEach(self.observerCallbacks, function(callback){
callback(currentLoginTeacher);
});
};
Controller:
// 注冊觀察者
teacher.reisterObserverCallback(function(teacher){
$scope.data.CurrentLoginTeacher = teacher;
});
使用時(shí)調(diào)用self.notifyObserver方法。只要是注冊過的觀察者都會得到一個(gè)通知。
時(shí)序圖
總結(jié)
觀察者模式：我覺得用一個(gè)詞來總結(jié)，就是群發(fā)。
當(dāng)一個(gè)對象發(fā)生改變的同時(shí)，需要其他對象也改變，但是并不知道具體有多少個(gè)對象改變。
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了AngularJS指令用法,較為詳細(xì)的分析了AngularJS指令的功能、用法及自定義指令的相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-11-11
本文主要對Angular的模塊化進(jìn)行案例分析介紹，具有一定的參考價(jià)值，下面跟著小編一起來看下吧2016-12-12
Angular刷新當(dāng)前頁面的實(shí)現(xiàn)方法
這篇文章主要介紹了Angular刷新當(dāng)前頁面的實(shí)現(xiàn)方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-11-11
這篇文章主要介紹了angular4筆記系列之內(nèi)置指令小結(jié),小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-11-11
初學(xué)者AngularJS的環(huán)境搭建過程
這篇文章主要介紹了初學(xué)者AngularJS的環(huán)境搭建過程,在文章給大家提到了Angular-cli的特性，大家一起看看吧2017-10-10
AngularJs的UI組件ui-Bootstrap之Tooltip和Popover
這篇文章主要介紹了AngularJs的UI組件ui-Bootstrap之Tooltip和Popover，tooltip和popover是輕量的、可擴(kuò)展的、用于提示的指令。具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-07-07
本文主要介紹AngularJS ng-mousedown 指令,這里幫大家整理了ng-mousedown 指令的基本資料,并附代碼示例,有需要的朋友可以參考下2016-08-08
AngularJS基礎(chǔ)學(xué)習(xí)筆記之簡單介紹
AngularJS 不僅僅是一個(gè)類庫，而是提供了一個(gè)完整的框架。它避免了您和多個(gè)類庫交互，需要熟悉多套接口的繁瑣工作。它由Google Chrome的開發(fā)人員設(shè)計(jì)，引領(lǐng)著下一代Web應(yīng)用開發(fā)。也許我們5年或10年后不會使用AngularJS，但是它的設(shè)計(jì)精髓將會一直被沿用。2015-05-05
本篇文章主要介紹了淺析Angular2子模塊以及異步加載，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-04-04
angular-ngSanitize模塊-$sanitize服務(wù)詳解
本篇文章主要介紹了angular-ngSanitize模塊-$sanitize服務(wù)詳解 ，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-06-06