返回目錄

MVVM是一種架構思想，是一種解決問題的方式，對于一個項目，一個功能模塊，你可以選擇使用ＭＶＶＭ的架構來實現，而knockoutjs只是實現MVVM的一種工具，它是在前端實現的，這一點，我們必須的清楚．

思想

下面說一下這講的重點，前臺和后臺的分工問題，占占認為，前臺只負責頁面及頁面ＣＳＳ及實現效果的ＪＳ，而后臺的工作包括業務的處理，數據的持久化，前臺數據的綁定（knockoutjs）等等．

實踐

下面是前臺HTML代碼

<table border="1"><tr><th>QuestionInfoID</th><th>用戶</th><th>類型</th><th>知識點</th><th>難度</th><th>日期</th><th>年級</th><th>學科</th><th>圖像</th></tr><tbody data-bind="foreach:model"><tr><td data-bind="text:QuestionInfoID"></td><td><span data-bind="if:Partner_Info"><span data-bind="text:Partner_Info.AccountName"></span></span><span data-bind="if:User_Info"><span data-bind="text:User_Info.RealName"></span></span></td><td data-bind="text:OwnerType"></td><td data-bind="text:Knowledge"></td><td data-bind="text:Difficulty"></td><td data-bind="text:AddTime"></td><td data-bind="foreach:Question_Point_R"><span data-bind="text:Point_Info.Grade"></span></td><td data-bind="foreach:Question_Point_R"><span data-bind="text:Point_Info.Subject"></span></td><td><img width="21" height="21" src="1.jpg" onerror="errorImg(this)" /></td></tr></tbody></table>

下面是后臺的knockoutjs代碼

@Html.Pager(Model)//C#數據分頁 <script type="text/ecmascript">//圖像加載出錯時的處理function errorImg(img) {img.src = "http://www.baidu.com/img/bdlogo.gif";img.onerror = null;}var model = ko.observableArray(@Html.Raw(Json.Encode(Model)));//從后臺得到數據集合，并轉化為json對象ko.applyBindings(model); </script>

運行截圖

說明

在這個例子中，我們使用了knockoutjs里的if,foreach等關鍵字，if可以判斷一個對象是否為空，而foreach可以把集合對象遍歷出來．

返回目錄

轉載于:https://www.cnblogs.com/lori/p/3682345.html

總結

以上是生活随笔為你收集整理的MVVM架构~前台后台分离的思想与实践的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。