V zadnjem videoposnetku smo predloge obravnavali s krmili. Toda krmilo ni edina predloga za rešitev bloka. V tem videoposnetku bomo uporabili predloge, ki so na voljo v podčrtaju.
Zakaj? No, eden od razlogov je, da morda že uporabljate podčrtaj za svoj projekt. To je izjemno priljubljena knjižnica, saj tako kot jQuery ponuja kup uporabnih metod, ki delujejo med brskalniki. Kot pravijo:
To je kravata, ki jo spremljajo jox jQuery in naramnice Backbone.js.
Če že uporabljate podčrtaj, bi bila to velika spodbuda za uporabo njegove predloge.
Tudi pri mojem hitrem preizkušanju je Handlebars 1.0.0 stisnjen in pomanjšan 14,2 KB, podčrtaj pa 4,9 KB stisnjen in pomanjšan. Krmilo ima preprosto več funkcij (npr. Komentiranje, zanke, poti, logika itd.). V našem preprostem predstavitvi teh funkcij tako ali tako ne potrebujemo, zato ni ravno poštena primerjava, toda oh, šele se učimo.
Namesto da bi imeli predlogo v HTML, moramo v JavaScript definirati predloge za podčrtaje. Vrnili smo se k združevanju nizov.
var compiled = _.template( "
" + " " + "
" + "" + "
" + "" + "" + "
" + " " + " " );
compiled
nato se spremeni v funkcijo, ki jo lahko pokličemo s kontekstom našega podatkovnega predmeta, in vrne HTML, izpolnjen s temi podatki. Da bi bili učinkoviti, bomo povezali HTML, ki se vrne v en velik niz, da ga bomo lahko samo enkrat dodali v DOM:
var i, html = ""; for (i = 0; i < data.movies.length; i++) ( html += compiled(data.movies(i)); ) $("#movies").append(html);
V tem videoposnetku smo povzeli tudi pridobivanje podatkov. Ustvarili smo vir JSON in za njegovo uporabo uporabili funkcijo $ .getJSON () jQuery. Kot bi verjetno morali početi v "resničnem življenju".
$.getJSON("/path/to/json.js", function(data) ( ));
Naša zanka for in takšna, ki se opira na te podatke, gre tam v povratni klic. Ali bolj verjetno pokliče kakšno drugo dobro imenovano funkcijo, da to reši, pri čemer stvari ostanejo čisto ločene.
Tu smo končali:
Oglejte si Pen IpAdn Chrisa Coyierja (@chriscoyier) na CodePen
Treba je opozoriti, da je LoDash 100% združljiv s tem, kar smo naredili tukaj. Nisem povsem prepričan, ali je predloga LoDash kaj boljša / hitrejša / počasnejša / slabša od podčrtaj, vendar sem zamenjal knjižnice in predstavitev je delovala v redu.