Play framework 2.0 -模板引擎

#模板引擎

 

1.基於Scala的類型安全的模板引擎

 

Play2.0的有個新的基於Scala的十分強大的模板引擎,它的設計靈感來自於ASP.NET的Razor。

具體來說:

a.緊湊、表現力、流暢:它最大限度的減少了一個文件中所需字符和按鍵的數量,使得可以快速流暢的編碼。

不像大多數模板語法,你不需要打斷你的編碼,在HTML中來顯示的表明服務代碼塊。

解析器能聰明的推斷出它們。這使得代碼緊湊,語法乾淨流暢,編碼快速、有趣。

b.容易學習:它可以用最少的概念讓你迅速成爲生產力。您可以使用簡單的Scala的結構和所有現有的HTML技能。

c.不是一種新的語言:我們有意識地選擇了不創造一門新的語言。相反,我們想使Scala開發人員可以使用他們現有的Scala語言技能,

並提供一個模板標記的語法,使HTML構建工作流程。

d.任何文本編輯器中編輯:它不需要特定的工具,使您能夠使用任何普通的文本編輯器都很有工作效率。

 

注意:儘快模板引擎使用Scala作爲表現語言,但這對於Java開發者並不是問題。你儘可以把Scala當Java來使用。

記住,模板中不是寫複雜邏輯的地方,不應該在模版裏寫複雜的Scala代碼。

使用後綴語法定義參數類型。泛型類型定義使用[]符號,而不是通常Java語法中的<> 。例如,你寫的List[String],與Java中的List<String>是相同的。

 

2.概述

 

Play的Scala模板是個包含了小塊Scala代碼的簡單文本文件。模板可以生成任意的文本格式,如HTML,XML或CSV。

模板系統是爲了HTML開發者能舒服的工作,允許前後端開發這容易使用模板而設計的。

模板根據一個簡單的命名規約被編譯爲標準的Scala函數。如果你創建了一個views/Application/index.scala.html的模板文件,

那麼它會生成一個包含一個render()方法的類-views.html.Application.index。

下面是一個簡單的模板:

@(customer: Customer, orders: List[Order])

	 
	<h1>Welcome @customer.name!</h1>

	<ul> 
	@for(order <- orders) {
	  <li>@order.getTitle()</li>
	} 
	</ul>

 

你可以向通常在類裏調用方法一樣使用任意的Java代碼調用它:


Content html = views.html.Application.index.render(customer, orders);
 

3.語法:神奇的‘@’

 

Scala模板用@作爲一個特殊字符。每次當這個字符出現,就表明是動態語句的開始。你無需顯式的關閉代碼塊,模板能夠自動推斷你代碼的結尾。

因爲模板引擎會通過分析你的代碼自動檢測你的代碼塊的結束,此語法僅支持簡單的語句。如果你想插入一個多標記的語句,顯式地使用括號標記:

 

Hello @(customer.getFirstName() + customer.getLastName())!
Hello @{val name = customer.getFirstName() + customer.getLastName(); name}!
 

@是個特俗字符,如果你想使用它,可以使用兩個@(@@)對它做一下轉移:

My email is bob@@example.com

 

4.模板參數

 

模板就像函數,所以它也需要參數,參數要在模板文件的頂部聲明。

@(customer: models.Customer, orders: List[models.Order])

也可是用默認的值設置參數

@(title: String = "Home")

或者甚至若干個參數組

@(title:String)(body: Html)

 

5.迭代

 

可以使用for關鍵字,用漂亮的標準方式:

 

<ul>
@for(p <- products) {
  <li>@p.getName() ([email protected]())</li>
} 
</ul>
 

6.if語句塊

 

if塊沒什麼特殊的,簡單的使用Scala的標準if語句:

 

@if(items.isEmpty()) {
  <h1>Nothing to display</h1>
} else {
  <h1>@items.size() items!</h1>
}
 

7.申明可重用模塊

 

用下面的代碼創建可複用代碼塊:

 

@display(product: models.Product) = {
  @product.getName() ([email protected]())
}
 
<ul>
@for(product <- products) {
  @display(product)
} 
</ul>
 

也可以什麼純代碼可複用模塊:

 

@title(text: String) = @{
  text.split(' ').map(_.capitalize).mkString(" ")
}
 
<h1>@title("hello world")</h1>
 

注意:在模版中以這樣的方式申明代碼塊有時候很有用,但是記着,模板不是寫複雜邏輯的最佳地方。

把它寫在Java類中通常更好。

 

 

8.聲明可複用值

 

可以用defining幫助定義作用域值:

 

@defining(user.getFirstName() + " " + user.getLastName()) { fullName =>
  <div>Hello @fullName</div>
}
 

9.導入語句

 

可以在模板或字模板的開頭導入任意東西:

 

@(customer: models.Customer, orders: List[models.Order])
 
@import utils._
 

10.註釋

 

使用@* *@爲Server端的代碼塊添加註釋。

 

11.轉義

 

默認的動態部分根據模板類型的規則被轉義。如果你想輸出一段原始內容,就用模板的類型包裝它:

 


<p>
  @Html(article.content)    
</p>
 

 

#常見的模板用例

 

模板,也就是簡單的函數,可以以你想要的任意方式構成。下面是一些常見的場景的幾個例子。

 

1.佈局

 

我們聲明一個模板views/main.scala.html,作爲主要佈局模板:

@(title: String)(content: Html)
	<!DOCTYPE html>
	<html>
	  <head>
	    <title>@title</title>
	  </head>
	  <body>
	    <section class="content">@content</section>
	  </body>
	</html>
 

正如你所見,這個模板有兩個參數,一個頭title和一個HTMLcontent塊。,現在我們看看另外一個模板:

@main(title = "Home") {
	    
	  <h1>Home page</h1>
	    
	}
 

有時你需要一個第二頁的具體內容塊顯示側欄或導航,例如,你可以增加一個額外的參數:

 

@(title: String)(sidebar: Html)(content: Html)
	<!DOCTYPE html>
	<html>
	  <head>
	    <title>@title</title>
	  </head>
	  <body>
	    <section class="content">@content</section>
	    <section class="sidebar">@sidebar</section>
	  </body>
	</html>
 

 

在我們的index模板中是使用它:

@main("Home") {
	  <h1>Sidebar</h1>

	} {
	  <h1>Home page</h1>

	}
 

或者,我們可以單獨聲明側欄塊:

@sidebar = {
	  <h1>Sidebar</h1>
	}

	@main("Home")(sidebar) {
	  <h1>Home page</h1>

	}
 

2.標籤

 

寫一個簡單的標籤views/tags/notice.scala.html顯示一個HTML的通知:

@(level: String = "error")(body: (String) => Html)
	 
	@level match {
	    
	  case "success" => {
	    <p class="success">
	      @body("green")
	    </p>
	  }

	  case "warning" => {
	    <p class="warning">
	      @body("orange")
	    </p>
	  }

	  case "error" => {
	    <p class="error">
	      @body("red")
	    </p>
	  }
	    
	}
 

 

在其他模板中使用該模板:

@import tags._
	 
	@notice("error") { color =>
	  Oops, something is <span style="color:@color">wrong</span>
	}

 

3.包含(includes)

 

這裏也一樣沒什麼特殊的。你完全可以調用任何你喜歡的模板(或者叫函數吧,隨便啦)。

 


<h1>Home</h1>
 
<div id="side">
  @common.sideBar()
</div>
 
發佈了15 篇原創文章 · 獲贊 0 · 訪問量 2695
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章