JAVASCRIPT網頁應用程式設計

242

|

第十三章

接著就可以利用這行程式碼來產生模版內容：

$("#foo").html('recipesEJS', recipeData)

前面這段產生模版內容的程式碼，是利用 script 標籤的

id

屬性值（recipesEJS）來指定

欲處理的模版。

$.View 和子模版

如果只是要產生字串，可以直接使用

$.View(TEMPLATE,data)

，並傳入兩組參數：模版

的路徑，以及要用來置換模版內容的資料：

var html = $.View("template/items.ejs", items );

子模版（subtemplate）是一種相當常見的用法。假設我們有一份用來產生資料清單的模

版（

items.ejs

），通常會需要針對清單裡的每一筆資料，建立獨立的模版。這時我們會先

讓

template/items.ejs

模版幫每筆資料產生

<li>

標籤，再用

template/item.ejs

模版

來產生每筆資料項目的真正內容：

<% for( var i = 0; i < this.length; i++){ %>

<li>

<%= $.View("template/item.ejs", this[i]);

</li>

< % } %>

this

指的是傳入模版的資料。對

template/items.ejs

而言，

this

指的是存放所有資料

的陣列。對

template/item.ejs

而言，

this

指的是某筆資料。

延遲物件（Deferreds）

我們經常會需要在發送一組 Ajax 請求之後，再依據伺服器回傳的資料產生模版的內容。 ...