AngularJS中的MVC模式應用

2021-07-26 19:39:48 字數 1342 閱讀 4764

不管是之前專案還是技術分享,都接觸過一些mvc的東西,現在又在angularjs中遇到,重新拿起來總結一下。

模型(model)-檢視(view)-控制器(controller),mvc簡介可見:**mvc框架

1.由於**規模越來越大,用mvc可切分職責

2.由於很多邏輯是一模一樣的,用mvc方便復用

3.為了修改某一塊功能時不影響其他功能,用mvc更方便後期維護

但是,mvc只是一種手段而已,終極思想目標就是為了實現模組化與復用!

如上圖所示,控制器和檢視進行雙向互動,也負責跟模型進行雙向互動,但檢視和資料模型並沒有雙向互動。上圖指出乙個控制器是可以控制多個檢視的,肯定這些檢視間存在著某些公用的東西,那如果這些檢視之間並沒有任何邏輯關係呢?所以這經典情況只適合小型專案,大型的就需要轉變一下,如下圖實現方式2所示,不同的控制器控制不同的檢視,若用到同乙個資料模型,那這些控制器,共同使用同乙個資料模型就可以了。

那麼,又遇到乙個新的問題就是:當控制器1和控制器2中有兩個方法是一模一樣的,那怎麼辦?很多人就會想到抽出乙個公共的控制器來被繼承,如下所示:

事實證明不可取,至於原因,大家還是自己去查吧,嘿嘿~

那在angularjs中具體應該怎麼來實現通用的控制器呢?請見實現方式3

在這裡,把通用的東西抽成了乙個服務,然後讓控制器去呼叫它,而不是讓控制器來繼承乙個公共的控制器。

},angular

function helloangular($scope) ;

}

這裡控制器是由function函式helloangular來充當的,通過ng-controller這個指令來實現helloangular控制器,執行時會先看到greeting.text顯示,原因是在頁面還沒載入出來時,使用者是可以看到該內容的,是挺尷尬的,但是我還沒弄清楚怎麼來避免。

當需要修改greeting內容時,只需要js檔案修改text的即可!

簡單說說 angularJs 中的 MVC

mvc 是一種物件導向軟體設計的模式,設計都餓使用目的就是為了 減少軟體日益增長的複雜度,使軟體的可維護性 可復用性得到提高 mvc的設計側重於 圖形使用者介面,比如說 office qq等這些桌面應用程式。或者是基於瀏覽器的網咯應用,這些都需要大量的視窗 選單。文字類與使用者進行互動。sss m ...

cocos creator中的MVC設計模式

在遊戲開發的行業中摸爬滾打走了很多路,在這裡將我的經驗分享給大家。無論是unity或者是cocos,白鷺 在遊戲的設計框架中大多數程式設計師還是遵循mvc來開發的。今天的涉及就是mvc模式,我以creator typesprite講解。首先為什麼用mvc,好處又是什麼呢?mvc無人不知,可很多程式設...

php的mvc設計模式,什麼是MVC設計模式?,

詳細內容 model view controller簡稱mvc,即模型檢視控制器。mvc設計模式指定應用程式由資料模型 呈現資訊和控制資訊組成。該模式要求將每個模式分成不同的物件。mvc更像是一種架構模式,但並不適用於完整的應用程式。mvc主要與應用程式的ui 互動層有關。你仍然需要業務邏輯層,可能...