[Mustache] 템플릿 엔진 머스타치에서 조건문(if) 여러개 사용하기

 

 

애증의 머스타치 ..

 

머스타치에서 조건문 사용 방법

---

1. 사용할 데이터를 정의해준다.

// hash
{
  "name": "Evan",
  "company": "",
  "address": "Seoul"
}

 

2. 템플릿 상에서 정의된 데이터를 불러와 조건문 안에 넣는다.

// true
{{#name}} 
제 영어 이름은 {{name}}입니다.
{{/name}}

/false
{{^company}} 
제 회사는 없습니다. 
{{/company}}

/false
{{^address}} 
제 집은 {{address}}에 있습니다. // address에 'Seoul'이라는 값이 있기 때문에, 출력되지 않습니다.
{{/address}}

예시를 들다보니 회사도 없는 사람이 되어버렸지만, 이건 조건문을 1개 사용할 때로 문제될 것이 없다.
#으로 묶인 케이스는 중괄호 안의 변수가 참인 경우에 아래 코드가 실행되고, 반대로 ^으로 묶인 케이스는 거짓인 경우가 된다. 그럼 이제 2개의, 혹은 그 이상의 조건문을 겹쳐서 사용하려면 어떡해야 할까?

 

3-1. 조건들이 AND 연산자로 묶인 경우

// true true
{{#name}}{{#address}}
제 이름은 {{name}}이고 {{address}}에 삽니다.
{{/address}}{{/name}}

// false false
{{^name}}{{^compnay}}
제 이름은 {{name}}이고 {{company}}를 다닙니다. // name 변수에 대한 조건이 잘못되어 출력되지 않습니다.
{{/company}}{{/name}}

AND 연산자로 묶인 조건을 사용하고 싶다면, 직관적으로 사용하면 됩니다.
다만 조건들의 여닫는 순서를 신경써야 합니다. 

 

3-2. 조건들이 OR 연산자로 묶인 경우

// hash
// Node.js
const combinedCondition = name || adrress
... rendering

// php
$combinedCondition = $name || $adrress
... rendering


// template
{{#combinedCondition}}
제 이름은 {{name}}이고 {{address}}에 삽니다.
{{/combinedCondition}}

OR 연산자로 묶인 조건을 사용하고 싶다면, 템플릿 쪽에서는 조건을 묶을 수 없습니다.
해쉬 쪽으로 넘어가서 조건들을 OR 연산자로 묶어준 뒤, 하나의 변수로 렌더링 해서 템플릿으로 넘겨주면 됩니다.

---

마치며

생각보다 조건 1개에 대한 포스팅은 많은데, 여러개의 조건을 사용하는 포스팅은 없어 간단히 글을 써보았습니다.
머스타치가 'Logic-less'와 'Strong seperation of concerns'를 원칙으로 만들어졌다고 하여 쉬울 줄 알았으나, 되려 안써본 문법들이 많아 어렵다고 느껴졌습니다. 단순 숙련도의 문제일수도 있지만... 이게 되네? 이게 안되네?를 연신 외치며 코드를 짜다보니 스트레스가 쌓이는 느낌입니다. 그럼 여기서 글을 마치겠습니다.