แม่แบบอีเมลแบบไดนามิก
แม่แบบอีเมลแบบไดนามิกของ Engagelab รองรับภาษาแม่แบบ Handlebars เพื่อแสดงเนื้อหาเฉพาะบุคคลที่ส่งผ่าน API
การแทนที่ตัวแปร
การแทนที่พื้นฐาน
ตัวอย่างแม่แบบ
<p>Hello {{firstname}}</p>
ข้อมูลทดสอบ
{ "firstName": "Engagelab" }
ผลลัพธ์ที่แสดง
<p>Hello Engagelab</p>
ผลลัพธ์ที่แสดง
ตัวอย่างแม่แบบ
<p>Hello {{user.profile.firstName}}</p>
ข้อมูลทดสอบ
{
"user": {
"profile": {
"firstName": "Engagelab"
}
}
}
ผลลัพธ์ที่แสดง
<p>Hello Engagelab</p>
formatDate
formatDate รองรับ Unix timestamps หรือเวลาที่จัดรูปแบบ ISO8601 และแปลงเป็นรูปแบบที่คุณระบุโดยใช้ตัวแทนในตารางด้านล่าง
โดยใช้เวลา UTC 1987-09-20T20:55:00.000Z
เป็นตัวอย่าง ผลลัพธ์การแปลงจะแสดงในตาราง:
ตัวแทน | ผลลัพธ์ |
---|---|
YYYY | 1987 |
YY | 87 |
MMMM | September |
MMM | Sep |
MM | 09 |
M | 9 |
DD | 20 |
D | 20 |
dddd | Sunday |
ddd | Sun |
hh | 08 |
h | 8 |
HH | 20 |
H | 20 |
mm | 55 |
m | 55 |
ss | 00 |
s | 0 |
A | PM |
ZZ | +0000 |
Z | +00:00 |
ผลลัพธ์
<p>{{formatDate timeStamp dateFormat}}</p>
<!-- ตัวอย่างการชดเชยเขตเวลา -->
<p>{{formatDate timeStamp dateFormat timezoneOffset}}</p>
ข้อมูลทดสอบ
{
"timeStamp": "1987-09-20T12:55:00.000Z",
"dateFormat": "YYYY-MM-DD HH:mm:ss A",
"timezoneOffset": "+0800"
}
ผลลัพธ์ที่แสดง
<!-- ผลลัพธ์ที่แสดง (แม่แบบ 1) -->
<p>1987-09-20 12:55:00 PM</p>
<!-- ผลลัพธ์ที่แสดง (แม่แบบ 2) -->
<p>1987-09-20 20:55:00 PM</p>
Insert
ผลลัพธ์ที่แสดง (แม่แบบ 2)
<p>Thank you for contacting us about {{insert businessName "your business"}}.</p>
ข้อมูลทดสอบ
// ข้อมูลทดสอบ 1
{}
// ข้อมูลทดสอบ 2
{
"businessName": "Engagelab"
}
ผลลัพธ์ที่แสดง
<!-- ผลลัพธ์ที่แสดง 1 -->
<p>Hello Ben! Thank you for contacting us about your business.</p>
<!-- ผลลัพธ์ที่แสดง 2 -->
<p>Hello Customer! Thank you for contacting us about Engagelab.</p>
คำสั่งเงื่อนไข
If, Else, Else If
ตัวอย่างแม่แบบ
{{#if user.profile.isTeacher}}
<p>Hello, Teacher {{user.profile.firstName}}</p>
{{else if user.profile.isStudent}}
<p>Hello, Student {{user.profile.firstName}}</p>
{{else}}
<p>Hello, {{user.profile.firstName}}! Welcome.</p>
{{/if}}
ข้อมูลทดสอบ
// ข้อมูลทดสอบ 1
{
"user": {
"profile": {
"firstName": "Zhang San",
"isTeacher": true
}
}
}
// ข้อมูลทดสอบ 2
{
"user": {
"profile": {
"firstName": "Li Si",
"isStudent": true
}
}
}
// ข้อมูลทดสอบ 3
{
"user": {
"profile": {
"firstName": "Wang Wu",
}
}
}
ผลลัพธ์ที่แสดง
<!-- ผลลัพธ์ที่แสดง (ข้อมูลทดสอบ 1) -->
<p>Hello, Teacher Zhang San</p>
<!-- ผลลัพธ์ที่แสดง (ข้อมูลทดสอบ 2) -->
<p>Hello, Student Li Si</p>
<!-- ผลลัพธ์ที่แสดง (ข้อมูลทดสอบ 3) -->
<p>Hello, Wang Wu! Welcome.</p>
Unless
ตัวอย่างแม่แบบ
{{#unless license}}
<p class="warning">WARNING: This entry does not have a license!</p>
{{/unless}}
ข้อมูลทดสอบ
{}
ผลลัพธ์ที่แสดง
<!-- ผลลัพธ์ที่แสดง -->
<p class="warning">WARNING: This entry does not have a license!</p>
ผลลัพธ์ที่แสดง
ตัวดำเนินการเปรียบเทียบรองรับสองวิธีการใช้งาน: พื้นฐาน และ พร้อม else.
ไวยากรณ์ที่รองรับแสดงในตารางด้านล่าง:
นิพจน์ | คำอธิบาย |
---|---|
greaterThan | > |
lessThan | < |
equals | = |
greaterThanOrEquals | >= |
lessThanOrEquals | <= |
notEquals | != |
พื้นฐาน
ตัวอย่างแม่แบบ
<p>
{{#greaterThan truckWeight limitWeight}}
The truck is not allowed to pass.
{{/greaterThan}}
</p>
ข้อมูลทดสอบ
{
"truckWeight": 6,
"limitWeight": 5
}
ผลลัพธ์ที่แสดง
<p>
The truck is not allowed to pass.
</p>
พร้อม Else
ตัวอย่างแม่แบบ
<p>
{{#greaterThan truckWeight limitWeight}}
The truck is not allowed to pass.
{{else}}
The truck is allowed to pass.
{{/greaterThan}}
</p>
ตัวอย่างแม่แบบ
{
"truckWeight": 5,
"limitWeight": 5
}
ผลลัพธ์ที่แสดง
<p>
The truck is allowed to pass.
</p>
in, notIn
เหมือนกับตัวดำเนินการเปรียบเทียบ รองรับสองวิธีการใช้งาน: พื้นฐาน และ พร้อม else
ตัวอย่างแม่แบบ
<p>
{{#in fruit favoriteFruits}}
Like to eat.
{{else}}
Do not like to eat.
{{/in}}
</p>
ข้อมูลทดสอบ
// ข้อมูลทดสอบ 1
{
"fruit": "Apple",
"favoriteFruits": [
"Apple",
"Banana",
"Orange"
]
}
// ข้อมูลทดสอบ 2
{
"fruit": "Grape",
"favoriteFruits": [
"Apple",
"Banana",
"Orange"
]
}
ผลลัพธ์ที่แสดง
<!-- ผลลัพธ์ที่แสดง 1 -->
<p>
Like to eat.
</p>
<!-- ผลลัพธ์ที่แสดง 2 -->
<p>
Do not like to eat.
</p>
การวนซ้ำ
ลูป (Each)
ตัวอย่างแม่แบบ
<ul>
{{#each fruits}}
<li>{{this}}</li>
{{/each}}
</ul>
ข้อมูลทดสอบ
{
"fruits": [
"Apple",
"Banana",
"Orange"
]
}
ผลลัพธ์ที่แสดง
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Orange</li>
</ul>
หมายเหตุเพิ่มเติม
เมื่อใช้ each
เพื่อวนซ้ำอาร์เรย์ คุณสามารถใช้ {{@index}}
เพื่ออ้างอิงดัชนีการวนซ้ำปัจจุบัน
{{#each array}} {{@index}}: {{this}} {{/each}}
นอกจากนี้ สำหรับการวนซ้ำวัตถุ {{@key}}
อ้างอิงชื่อคีย์ปัจจุบัน
{{#each object}} {{@key}}: {{this}} {{/each}}
อ้างอิงชื่อคีย์ปัจจุบัน
ตัวอย่างแม่แบบ
{{#with user.profile}}
<p>Hello {{firstName}}</p>
{{/with}}
ตัวอย่างแม่แบบ
{
"user": {
"profile": {
"firstName": "Engagelab"
}
}
}
ผลลัพธ์ที่แสดง
<p>Hello Engagelab</p>