knockout --- foreach -- 前端必備

　　好久好久沒寫博客了，丫的，節操掉一地了，頹廢了，慚愧。

 

　　好久好久沒有弄 knouckout.js 了，今天從新操做，蛋疼啊，忘記得差很少了，因而只好硬着頭皮再去看官網，因而，feel慢慢回來了。

 

　　原本不打算用 knouckout 的了，可是人都是懶惰的，何況我一直信奉，不懂偷懶的程序員不是好的程序員！

 

　　若是不偷懶，就寫一大堆的js，之後維護也是很痛苦的。。。

 

　　這裏不討論基本語法什麼的，官網上一堆堆的，親們本身去找吧~ 官網

 

　　另外，想打算開個一系列的 knouckout，好好總結本身的所學，解放衆多的那些作後端又要作前端的 程序猿，誰要看，給我32個贊，就開始寫。開玩笑了，沒有拉廣告的嫌疑，等項目告一段落了就開始着手寫了，不過也已經有人寫了，我但願寫點不一樣的。

 

這裏是湯姆大叔的：猛搓我

 

　　看效果圖：

 

1.前端代碼：

 1 <div class="modal-body" data-bind="foreach: job">
 2                     <div>
 3 
 4                         <div class="panel-group" id="accordion">
 5                             <div class="panel panel-default">
 6                                 <div class="panel-heading">
 7                                     <h4 class="panel-title">
 8                                         <a data-toggle="collapse" data-toggle="collapse"
 9                                             data-bind="text:title" data-parent="#accordion"
10                                             href="#collapseOne"> </a>
11                                     </h4>
12                                 </div>
13                                 <div id="collapseOne" class="panel-collapse collapse in">
14                                     <div class="panel-body" data-bind="html:content"></div>
15                                 </div>
16                             </div>
17                         </div>
18                     </div>
19 
20                 </div>

View Code

 

2.js

var viewModel = {
job: ko.observableArray([ ])
};
ko.applyBindings(viewModel);

　　

3.ajax裏傳值回來後處理：

viewModel.job(j);

　　OK，以上代碼搞定了！原本要不少js代碼寫的循環，如今在 knockout 的幫助下，一切都變得美好了！

 

犯過的錯誤：

1.不能重複綁定同一個元素，由於每次ajax後都會從新執行代碼，代碼以下（是該錯誤的代碼）：

ko.applyBindings({
		job : j,//這裏的j是個人ajax 返回的 json數組
	});

2.基於以上錯誤，想到了清除綁定，可是結果就是，每次ajax請求，數據都會翻倍，好比說：我原先只有3條記錄的，可是ajax後就變成6條記錄了，顯然不是我想要的，代碼以下：

ko.cleanNode(document.body);
    ko.applyBindings({
		job : j,
});

 

解決方案在一開始的時候就已經有了，以此謹記，另外，最近得惡補 English 了，發現看 English 少了之前的感受了。

歡迎拍磚，轉載請標明出處！

有問題能夠請教，本人QQ：651936145，請說明備註：knockout 探討。