Uczę się Szkieletu / Kierownicy / Wymagaj. Rozglądałem się przez Internet i na SO - czy są jakieś tutoriale lub strony, które możesz mi polecić, które dostarczą przydatnych informacji na temat używania kierownicy zamiast podkreślenia?
Odpowiedzi:
77 dla odpowiedzi № 1Używanie pliku handlebars.js zamiast podkreślania szablonów jest całkiem proste. Sprawdź ten przykład:
https://cdnjs.com/libraries/backbone.js/tutorials/what-is-a-view (przejdź do sekcji "Ładowanie szablonu")
SearchView = Backbone.View.extend({
initialize: function(){
this.render();
},
render: function(){
// Compile the template using underscore
var template = _.template( $("#search_template").html(), {} );
// Load the compiled HTML into the Backbone "el"
this.el.html( template );
}
});
Zasadniczo konwencją szkieletu jest zbudowanie html w funkcji renderowania. Wykorzystanie silnika szablonowego pozostaje całkowicie do ciebie (co lubię w Backbone). Więc po prostu zmienisz to ...
SearchView = Backbone.View.extend({
initialize: function(){
this.render();
},
render: function(){
// Compile the template using Handlebars
var template = Handlebars.compile( $("#search_template").html() );
// Load the compiled HTML into the Backbone "el"
this.el.html( template );
}
});
Ponieważ używasz wymagać.js, możesz uczynić Handlebars zależnością u góry twojego modułu. Jestem całkiem nowy w tym, ale brzmi to tak, że skupienie się na nauce będzie wyglądało na Backbone.js i użycie require.js.
2 dla odpowiedzi nr 2
Wolałbym skompilować szablon raz(podczas inicjowania), dzięki czemu unikniesz ponownej kompilacji szablonu przy każdym renderowaniu. Musisz również przekazać model do skompilowanego szablonu, aby wygenerować kod HTML:
SearchView = Backbone.View.extend({
initialize: function(){
// Compile the template just once
this.template = Handlebars.compile($("#search_template").html());
this.render();
},
render: function(){
// Render the HTML from the template
this.$el.html(this.template(this.model.toJSON()));
return this;
}
});
1 dla odpowiedzi nr 3
Jeśli używasz pliku require.js, nie będziesz mógł użyć bieżącego pliku Handlebars. Użyłem następujących Plugin Handlebars i wydaje się być na bieżąco z aktualną wersją. Wystarczy, że zastąpisz plik Handlebars powyższą wtyczką, jeśli Handlebars zwróci null w twoim module.
0 dla odpowiedzi nr 4
define(["app", "handlebars",
"text!apps/templates/menu.tpl"
], function (app, Handlebars, template) {
return {
index: Marionette.ItemView.extend({
template: Handlebars.compile(template),
events: {
"click .admin-menu-ref": "goToMenuItem"
},
goToMenuItem: function (e) {
//......
}
})
}
});
new view.index({model: models});