JAVASCRIPT網頁應用程式設計

240

|

第十三章

假設我們希望在有人新增一筆 task 時，能夠接獲通知，好讓我們能夠即時將這筆新的

task 資料加進網頁裡。而且在加進網頁後，還要能監聽該筆 task 的所有變動，藉此確保

顯示的名稱是正確的。可以這麼寫：

Task.bind('created', function(ev, task){

var el = $('<li>').html(task.name);

el.appendTo($('#todos'));

task.bind('updated', function(){

el.html(this.name);

}).bind('destroyed', function(){

el.remove();

})

});

在檢視器裡使用用戶端模版

JavaScriptMVC 的檢視器，其實就是用戶端模版。它會接收一些資料，並回傳一組字

串。檢視器所回傳的字串，基本上就是要被用來加進 DOM 元件的 HTML 程式碼。

$.View

是產生模版內容的程式介面，它利用模版降低程式的複雜度。其特色包括：

• 容易使用且一致的語法

• 可從 HTML 元件或外部檔案載入模版

• 可透過同步或非同步方式載入模版

• 可預先載入模版

• 可將處理過的模版存入快取

• 可將處理過的模版包進正式環境的建置版本中

• 支援

$.Deferred

JavaScriptMVC 已經納入四種不同的模版引擎：

• EJS

• JAML

• Micro

• Tmpl

雖然接下來的說明是採用 EJS 模版，不過大部分的概念適用於任何一種模版引擎（只是 ...