Velocity2

在js中調用Velocity 模板中的變量。不能調用對象和數組,可以調用對象中的某一個值(這個值不能是數組或對象。只能是字符或者數字)

 

Velocity是什麼一個java的後端模板引擎,後綴名是.vm

常用指令:

"#"用來標識Velocity的腳本語句,包括#set、#if 、#else、#end、#foreach、#end、#iinclude、#parse、#macro等;

如:

    #if($info.imgs)

        <img src="$info.imgs" border=0>

    #else

        <img src="noPhoto.jpg">

#end

 

 


#if($foo<10)

<strong>Go North</strong>

#elseif($foo==10)

<strong>Go East</strong>

#elseif($bar==6)

<strong>Go South</strong>

#else

<strong>Go West</strong>

#end

 

$"用來標識一個對象(或理解爲變量);
    如:$i、$msg、$TagUtil.options(...)等

 

"!"用來強制把不存在的變量顯示爲空白。

如當頁面中包含$msg,如果msg對象有值,將顯示msg的值,如果不存在msg對象同,則在頁面中將顯示$msg字符。這是我們不希望的,爲了把不存在的變量或變量值爲null的對象顯示爲空白,則只需要在變量名前加一個“!”號即可。

當使用!時表示當此變量值爲空時,顯示空字符串。比如當$article爲空,那會顯示“$article“,而$!article會顯示爲“”

如:$!Msg

 

在模板中設置變量:#set( $a = "Velocity" )

 

變量和字符串如何拼接: 例: <span>${obj.name}我是大晴</span>

 

對象調用方法: 例如:$article.GetListByTitle('nvelocity')或${article.GetListByTitle('nvelocity')}。其實對對象的屬性值也可以用$article.get_Title()獲得。

 

循環語法:

#foreach( $info in $list) $info.someList #end  循環讀取集合list中的對象,並作相應的處理。

如:EasyJF開源論壇系統中論(0.3)壇首頁顯示熱門主題的html界面模板腳本:

#foreach( $info in $hotList1)

<a href="/bbsdoc.ejf?easyJWebCommand=show&&cid=$!info.cid" target="_blank">$!info.title</a><br>

#end

上面的腳本表示循環遍歷hotList1集合中的對象,並輸出對象的相關內容。

Velocity(7)——#foreach指令

首先是#foreach的簡單示例:

#foreach( $elem in $allElems)
    $elem</br>
#end

上面這個例子中,$allElems可以是一個Vector,一個HashTable,一個數組。

在Velocity中,有一個變量$velocityCount用作循環計數,初始值是1。這個變量的名字和初始值是在velocity.properties文件裏配置的。

 

 

$velocityCount 

這個變量在velocity屬性文件中定義,在#foreach的時候可以用得上,比如我foreach一個List<User>時,我們可以使用$velocityCount判斷完成形如“張三,李四”的輸出(李四後面沒有逗號) 

Java代碼  

1. #foreach($user in $users)  

2.     #userNode($user)#if($velocityCount != $user.size()),#end   

3. #end  



或 

Java代碼  

1.  #foreach($user in $users)  

2.      #if($velocityCount != 1),#end #userNode($user)  

3.  #end  


默認$velocityCount 從1開始。 

#Parse

#Parse用來在當前模板中引入並執行另一個(本地的)模板——可以是靜態的,也可以是動態的——並把結果嵌入到當前位置。#Parse()指令的參數,可以是一個雙引號括起來的文件名,也可以是一個變量,但是它不能接受多個參數。

被#Parse引入的文件仍然可以使用#Parse指令。在velocity.properties文件中有一個屬性directive.parse.max.depth,默認值是10,它指定了#Parse嵌套的最大層次。既然#Parse嵌套是允許的,#Parse遞歸也是允許的。

假如a.vm #Parse b.vm,那麼a.vm中定義的變量vb.vm中可以隨便使用。如果b.vm也定義了v,在b.vm中可以隨便使用。如果b.vm也定義了v,那麼b.vm中用到的將會是自己的v,而不是a.vm中的v,而不是a.vm中的v。

 

包含文件#inclue("模板文件名")或#parse("模板文件名")

  主要用於處理具有相同內容的頁面,比如每個網站的頂部或尾部內容。

  使用方法,可以參考EasyJF開源Blog及EasyJF開源論壇中的應用!

  如:#parse("/blog/top.html")或#include("/blog/top.html")

parse與include的區別在於,若包含的文件中有Velocity腳本標籤,將會進一步解析,而include將原樣顯示。

註釋:

velocity的註釋是用多個#號來標識的,大段註釋用 #* 和 *#包起來
單行註釋:##註釋內容
多行註釋:
#*
註釋內容
*#

宏調用

macro指令讓模板設計者可以將些重複、相關的的腳本版斷定義爲一個功能塊.

這是一個獨立的vm模板

a.vm內容片段
#macro( tablerows $color $somelist )

#foreach( $something in $somelist )

    <tr><td bgcolor=$color>$something</td></tr>

#end

 

在b.vm中調用

b.vm中的內容片段

1.引入a.vm

2.

#set( $greatlakes = ["Superior","Michigan","Huron","Erie","Ontario"] )

#set( $color = "blue" )

<table>

    #tablerows( $color $greatlakes )

</table>

 

輸出結果:

<table>

    <tr><td bgcolor="blue">Superior</td></tr>

    <tr><td bgcolor="blue">Michigan</td></tr>

    <tr><td bgcolor="blue">Huron</td></tr>

    <tr><td bgcolor="blue">Erie</td></tr>

    <tr><td bgcolor="blue">Ontario</td></tr>

</table>

如果將宏#tablerows($color $list) 定義到一個模板庫中(Velocimacros template library), 其它模板就都可以訪問它了.

儘量不要直接在模板中使用#parse() 包含#macro() 指令.因爲#parse() 動作在運行時執行,時會有一個在VM 中查找元素的過程.

 

項目中注意點:

數組如何變量獲取值

#set($index = 0) -- 聲明一個變量

 

#set($keyName =$jobsAndTriggers.groups[$index])    --  $jobsAndTriggers.groups是一個數組獲取第$index的值。再賦值給$keyName

 

 

${keyName} -- 這是個字符串的輸出--可直接輸出到瀏覽器上

 

切記: js中無法直接獲取velocity設置的對象和數組。只能獲取對象中具體的值(字符串或數值)。單獨的js文件不能用velocity任何變量

 

在js中的操作:

  1. 獲取數組中某一個具體的值:"${jobsAndTriggers.groups[0]}"

 

數組$jobsAndTriggers.groups 是個數組在js中調用時,

如果是組中的元素是字符---必須將數組中的內容轉化成字符串才能取到。所以必須用"${jobsAndTriggers.groups[0]}"這種形式才能獲取到具體的值

 

如果數組中的元素是整數,則直接獲用$jobsAndTriggers.groups[0]可能會可以。這個我沒試過

注意:

Html中聲明一個$dd

 

在js中這麼寫是會報錯的:

 

也就是說不要將$dd賦值給一個js變量。再去和其他的velocity變量去組合。這是不對的

 

  1. 再html 中聲明,在js中調用

 

 

 <script>

   var index = ${index}

   console.log(index)

 </script>

 

 

 

 

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章