art-lemplate是新一代高性能JavaScript模板引擎，它可以將數(shù)據(jù)與HTML模板更加友好地結(jié)合起來(lái)，省去煩瑣的字符串拼接，使代碼更易于維護(hù)。
art-template模板引擎既可以在服務(wù)器端使用，也可以在瀏覽器端使用。此處僅講解art-template模板引擎在服務(wù)器端的使用。art-template模板引擎的下載和使用方法如下。
（1）模板引擎下載命令如下。
npm install artmplate
（2）使用模板引擎時(shí)應(yīng)在j腳本中導(dǎo)入模板引擎，并編譯模板。
//導(dǎo)入模板
const template · require('art-template');
//編譯模板
const result = template('./views/index.html', (
msg: 'Hello, art-template'
});
上述代碼中，rest用于存儲(chǔ)拼接結(jié)果;template0中的第l個(gè)參數(shù)表示模板文件的位置，第2個(gè)參數(shù)向模板中傳遞要拼接的數(shù)據(jù)，對(duì)象類(lèi)型或?qū)ο髮傩远伎梢灾苯釉谀０逯惺褂谩n-template模板引擎標(biāo)準(zhǔn)語(yǔ)法中引入了變量和輸出量，并支持JavaSeript表達(dá)式，使模板更易于讀寫(xiě)。下面講解art-template模板引擎的標(biāo)準(zhǔn)語(yǔ)法。
1.變量
在“{{}}”符號(hào)中，使用set關(guān)鍵字來(lái)定義變量a和變量b.示例代碼如下。
{{set a = 1}};
{{set b = 2}};
2.JavaScript表達(dá)式
在“{{}}”符號(hào)中，使用set關(guān)鍵字來(lái)定義變量a和變量b，示例代碼如下。
//JavaScript表達(dá)式
{{a ? b:c}};
{{a‖b}}1:
{{la + b}};
3.條件渲染
art-template模板引擎使用{{f}}…{{/if}}或者 {{if}}…{{ else if}}…{{/if}}來(lái)實(shí)現(xiàn)條件的判斷，通過(guò)判斷來(lái)渲染不同結(jié)果，示例代碼如下。
// if...語(yǔ)法
{{if user}}
<h2>{{user.name}}</h2>
{{/if}}
// if...else if...語(yǔ)法
{{if userl}}
<h1>{{user1.name}}</h1>
{{else if user2}}
<h2>{{user2.name}}</h2>
{{/if}}
上述代碼中，如果user用戶對(duì)象存在，就將其name屬性的值渲染到標(biāo)簽中。同理，使用[if]]…lelse if]]…[if]語(yǔ)法實(shí)現(xiàn)多個(gè)條件判斷。如果userl用戶對(duì)象存在，就將其name屬性的值渲染到標(biāo)簽中;如果user2用戶對(duì)象存在，就將其name屬性的值渲染到標(biāo)簽中。
4.列表渲染
at-lemplate模板引擎中的列表渲染使用each實(shí)現(xiàn)對(duì)目標(biāo)對(duì)象的循環(huán)遍歷，示例代碼如下。文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-483132.html
{{each target}}
{{$index}}{{$value}}
{{/each}}
上述代碼中，target 目標(biāo)對(duì)象支持Amay數(shù)組和Objecet對(duì)象類(lèi)型數(shù)據(jù)的迭代，target 目標(biāo)對(duì)象使用template(模板ID，data)函數(shù)的第2個(gè)參數(shù)來(lái)傳遞，使用“ d a t a [ ] ”中括號(hào)的形式來(lái)訪問(wèn)模板對(duì)象的屬性。 data[]”中括號(hào)的形式來(lái)訪問(wèn)模板對(duì)象的屬性。 data[]”中括號(hào)的形式來(lái)訪問(wèn)模板對(duì)象的屬性。index表示當(dāng)前索引值，$value表示當(dāng)前索引對(duì)應(yīng)的值。文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-483132.html
到了這里，關(guān)于服務(wù)器端模板引擎art-template的下載和使用的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
![[C++項(xiàng)目] Boost文檔 站內(nèi)搜索引擎(5): cpphttplib實(shí)現(xiàn)網(wǎng)絡(luò)服務(wù)、html頁(yè)面實(shí)現(xiàn)、服務(wù)器部署...](https://imgs.yssmx.com/Uploads/2024/02/642172-1.png)
