http://stackoverflow.com/questions/552934/what-javascript-templating-engine-do-you-recommend/7812081#7812081 ์์ ๋ฌธ์ ๋ฅผ ์ฐธ์กฐํ์ญ์์ค.
ํ ๊ฐ์ง ๊ฐ๋จํ ์ ๊ทผ ๋ฐฉ์์ ๋์ฐ๋ฏธ๋ฅผ ๋ฑ๋กํ๋ ๊ฒ์ ๋๋ค.
{{#each animals}}
{{#each organs}}
{{get .. this}}
{{/each}}
{{/each}}
Handlebars.registerHelper('get', function(obj, prop) {
return obj[prop];
});
์ด ๋ฌธ์ ๋ฅผ ๋ค์ ์ ๊ธฐํด์ ์ฃ์กํ์ง๋ง ์ํ ์ฐธ์กฐ๋ฅผ ์์ฑํ์ง ์๋ ํ ์ด 'get' ๋์ฐ๋ฏธ๊ฐ ๋ถ๋ชจ์๊ฒ ์ก์ธ์ค ๊ถํ์ ๋ถ์ฌํ๋ ๋ฐฉ๋ฒ์ ์ ์ ์์ต๋๋ค.
"{{get .. this}}"์ด(๊ฐ) ์๋ฏธํ๋ ๋ฐ๋ฅผ ํ์ฅํ ์ ์์ต๋๊น? ์ด๊ฒ์ด ๊ธฐ๊ด์ด๋ผ๋ฉด ์ด๋ป๊ฒ ๊ทธ๊ฒ์ ์ฌ์ฉํ์ฌ ๋ถ๋ชจ ๋๋ฌผ์ ์ฐพ์ ์ ์์ต๋๊น?
๋๋ handlebars.js๋ฅผ ์ฌ์ฉํ์ฌ ๊ฐ์กฑ ๋ชฉ๋ก์ ๋ฐ๋ณตํ ๋ค์ ํด๋น ๊ฐ์กฑ์ ๊ตฌ์ฑ์์ ๋ฐ๋ณตํ๊ณ ์ถ์ต๋๋ค. ๋ ๋ฃจํ ๋ด์์ ๋ ๋ค์ ์์ฑ์ ํ์ํ๊ณ ์ถ์ต๋๋ค. ๊ทธ๋ฌ๋ ๋ ๋ฒ์งธ ๋ฐ๋ณต์ ๋ค์ด๊ฐ๋ฉด ๊ฐ์กฑ ๋ณ์๊ฐ ํ๋๋ ํ์๋์ง ์์ต๋๋ค.
{{#each families}}
{{#each members}}
<p>{{ ( here I want a family name property ) }}</p>
<p>{{ ( here I want a member name property ) }}</p>
{{/each}}
{{/each}}
ํธ๋ค๋ฐ์์ ๊ฐ๋ฅํ๊ฐ์? ๊ทธ๋ ์ง ์๋ค๋ฉด ๊ด์ฐฎ์ต๋๋ค. ๋์์ ์ฃผ์๋ฉด ๊ฐ์ฌํ๊ฒ ์ต๋๋ค!
{{#each families}}
{{#each members}}
<p>{{ ../surname }}</p>
<p>{{ name }}</p>
{{/each}}
{{/each}}
์๋ ํ์ธ์ ์ฌ๋ฌ๋ถ ์ ๋ ์ง๊ธ ๋ ธ๋/์ต์คํ๋ ์ค๋ฅผ ๋ฐฐ์ฐ๊ณ ์์ต๋๋ค. ์์ ์ฝ๋๋ ์ ์๊ฒ ์ ํฉํ์ง ์์ต๋๋ค. ์ ๋ ์ต์คํ๋ ์ค ํธ๋ค๋ฐ๋ฅผ ์ฌ์ฉํ๊ณ ์์ต๋๋ค. ๋์์ฃผ์๊ฒ ์ต๋๊น? ์ต์คํ๋ ์ค ํธ๋ค๋ฐ๋ก ๊ฐ๋ฅํ๊ฐ์? ์ฌ๊ธฐ ๋ด ์ฝ๋๊ฐ ์์ต๋๋ค. gpareaData ๋ ๋ฐ๋ณต๋์ง๋ง ๋ถ๊ธฐ๋ ๋ฐ๋ณต๋์ง ์์ต๋๋ค .
{{#each gpareaData}}
<tr>
<td>
<select class="form-control" name="gp_branch[]">
<option value="{{id}}">{{desc}}</option>
{{#each branch}}
<option value="{{id}}">{{branch_desc}}</option>
{{/each}}
</select>
</td>
<td><button type="button" class="btn btn-primary btn-sm" id="addRws3"><i class="fa fa-plus"></i></button></td>
</tr>
{{/each}}
{{#all๋ฐ์ดํฐ}}
๋ชจ๋
{{#assignedData}}
ํ ๋น ๋
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ