У последњем видео снимку смо стали са помало замршеним нередом. Све у једном блоку ЈаваСцрипт-а мешали смо проналажење података, приказ и пословну логику и шаблон. У овом видеу ћемо почети да разбијамо те ствари да бисмо кренули ка организованијем, одрживијем и разумљивијем коду. Велики део тога је шаблонирање.
Крените на прво место у нашој шаблонској авантури са управљачима. Хандлебарс има паметан приступ у томе што је ХТМЛ за шаблон дословно стављен у ХТМЛ. Користите посебну ознаку. То чини лепо ауторско дело јер можемо да побегнемо од неспретности спајања низова (свих оних цитата и плус-ова) и добијемо лепо истицање синтаксе за ХТМЛ који нуди ваш уређивач. Наш образац је на крају изгледао овако:
((movieTitle))
((movieDirector))
Обратите пажњу на чудан typeатрибут на ознаци скрипте. То спречава извршење садржаја те ознаке. Коначно, Хандлебарс само истргне цријева ове ознаке и претвори је у функцију предлошка. Прилично паметан начин да се то заиста реши.
Ови делови ((movieTitle))су важни делови. На крају прослеђујемо објекат функцији за предлошке која се креира, а својства тог објекта се подударају са овим битовима резервираног места. Крмило је вероватно названо управљач, јер су ти битови чувара умотани у коврџаве заграде које одозго помало личе на управљач.
Следећи једноставан водич на веб локацији Хандлебарс, креирамо нашу функцију шаблонирања на следећи начин:
var source = $("#movie-template").html(); var template = Handlebars.compile(source);Затим у оквиру наше forпетље позивамо нашу нову функцију шаблонирања са објектом (контекстом) који садржи један филм. ХТМЛ ће бити враћен и ми ћемо га додати на страницу.
var html = template(data.movies(i)); $("#movies").append(html);Такође узмемо предложак у овом видеу и снимимо га на другу оловку. То само значи како бисте вероватно разбили свој код у стварном пројекту. Шаблон би готово сигурно био нека врста „укључују“.
Ево где смо завршили:
Погледајте оловку мдЦјЈ Цхриса Цоииера (@цхрисцоииер) на ЦодеПен-у
Овде смо направили неколико добрих корака ка бољем коду, али остаје нам још да га учинимо савршено чистим.