iOS中使用模板引擎渲染HTML介面

2021-07-05 13:02:38 字數 2224 閱讀 7430

- (void)loadhtmlstring:(nsstring *)string baseurl:(nsurl *)baseurl;

由於html內容通常是變化的,所以我們需要動態生成html**。通常我們從伺服器端獲取到標題、時間、作者和對應的內容,然後我們需要對這些資料處理之後拼接成一段html字串。對於傳統的做法是將上面的需要替換的內容填寫一些佔位符,放到指定的檔案中如(content.html),如下所示:

123

4567

891011

1213

1415

16

key_date key_author

key_content

然後在指定的地方使用如下的方式動態生成html**:

- (nsstring *)loadhtmlbystringformat:(nsdictionary *)data

在實際的使用中發現還是存在不少的問題,比如我們需要對資料進行預先處理的時候需要寫大量的

1

- (nsuinteger)replaceoccurrencesofstring:(nsstring *)target withstring:(nsstring *)replacement options:(nsstringcompareoptions)options range:(nsrange)searchrange;

這樣的替換,而且對於一些特殊的字元還需要進行特殊處理等,實在不是太友好,這樣就需要乙個引擎來專門處理這些事情,本文主要介紹mgtemplateenginegrmustache的使用。

mgtemplateengine的使用

mgtemplateengine是matt gemmell的作品,它是乙個比較流行的模板引擎,它的模板語言比較類似於smartyfreemarkerdjango。另外它可以支援自定義的filter(以便實現自定義的渲染邏輯),需要依賴正規表示式的工具類regexkit

1、建立模板

123

4567

891011

1213

1415

1617

18

2、渲染生成html字串

123

4567

891011

- (nsstring *)loadhtmlbymgtemplateengine:(nsdictionary *)data

3、說明

(1)mgtemplateengine提供的示例程式是執行在mac os上的,如果要使用到ios上面需要引入foundation框架

(2)對於執行在xcode6以上的環境下建立的工程由於沒有pch檔案可能會報錯,需要在mgtemplateengine的各個標頭檔案中引入foundation框架

(3)mgtemplateengine在github上的位址為

grmustache的使用

相比mgtemplateengine來說grmustache簡單不少,

1、處理模板檔案

模板檔案和mgtemplateengine的一樣。

2、渲染生成html字串

123

456

- (nsstring *)loadhtmlbygrmustache:(nsdictionary *)data

3、說明

(1)renderobject使用的資料的key必須要和模板中的佔位符一一對應起來

(2)grmustache在github上的位址為

1、《mgtemplateengine – templates with cocoa》

2、《mgtemplateengine 模版引擎簡單使用》

3、《grmustache document》

使用artTemplate模板引擎渲染複雜資料結構

arttemplate有原生語法和簡潔語法兩種語法,在乙個頁面中簡潔語法與原生語法不能混用,否則會殘生衝突,所以你首先得確定你要用簡潔語法還是原生語法。因此,下面通過arttemplate簡潔語法渲染一種稍微複雜一點的資料結構。會列舉兩種這樣的資料結構的實現方式。類似的資料結構是這樣的 vardat...

NodeJS中使用swig模板引擎

nodejs中的預設引擎是jade有點過於複雜,而且不是以html為基礎的,學習成本和前端適應成本都很大。而ejs雖然簡單,但不支援模板匯入,而且效率一般。swig的語法簡單,學習成本很低,符合常規邏輯,實驗了一下,非常滿意 swig的官網 swig 在nodejs隨便建立乙個express專案,直...

NodeJS中使用swig模板引擎

nodejs中的預設引擎是jade有點過於複雜,而且不是以html為基礎的,學習成本和前端適應成本都很大。而ejs雖然簡單,但不支援模板匯入,而且效率一般。swig的語法簡單,學習成本很低,符合常規邏輯,實驗了一下,非常滿意 swig的官網 swig 在nodejs隨便建立乙個express專案,直...