问题描述
应该如何视图的报
处理?
它必须被设置,否则事件不会触发(见here).
How should a view's el
be handled?It has to be set, otherwise events don't fire (see here).
但它应该是一个已经在页面上的元素?
在我的应用程序,我渲染(jQuery的模板)模板成的fancybox。我应该在报
在这种情况下?
But should it be an element that is already on the page?In my app, I render a (jQuery Templates) template into a Fancybox. What should the el
be in that case?
推荐答案
一个观点EL是所有事件绑定发生。你不必使用它,但如果你想骨干火,你需要做的埃尔你的渲染工作的事件。一次埃尔是DOM元素,但它不必须是一个$ P $对现有元件。如果你不拉一从当前页面,但是你必须把它插入到页面中,如果你想看到它做任何事情,它会被创建。
A views el is where all the event binding takes place. You don't have to use it but if you want backbone to fire events you need to do your rendering work on the el. A views el is a DOM element but it does not have to be a pre-existing element. It will be created if you do not pull one from your current page, but you will have to insert it into the page if you ever want to see it do anything.
一个例子:
我有一个创建个人项目的视图
An example:I have a view that creates individual items
window.ItemView = Backbone.View.extend({
tagName: "li", //this defaults to div if you don't declare it.
template: _.template("<p><%= someModelKey %></p>"),
events: {
//this event will be attached to the model elements in
//the el of every view inserted by AppView below
"click": "someFunctionThatDoesSomething"
},
initialize: function () {
_.bindAll(this, "render");
this.render();
},
render: function () {
this.el.innerHTML = this.template(this.model.toJSON());
return this;
}
});
window.AppView = Backbone.View.extend({
el: $("#someElementID"), //Here we actually grab a pre-existing element
initialize: function () {
_.bindAll(this, "render");
this.render(new myModel());
},
render: function (item) {
var view = new ItemView({ model: item });
this.el.append(view.render().el);
}
});
第一种观点仅创建列表项和第二个观点实际上它们放置在页面上。我认为这是类似于 。我认为,惯例是使你的内容到EL。因此,EL作为着陆点或把你的模板化内容的容器。骨干然后结合其事件到它里面的模型数据。
The first view just creates the list items and the second view actually places them on the page. I think this is pretty similar to what happens in the ToDo example on the backbone.js site. I think convention is to render you content into the el. So the el serves as a landing place or a container for placing your templated content. Backbone then binds its events to the model data inside of it.
当你创建一个视图中,您可以通过以下四种方式操作EL 报:
,标签名:
,的className:
和 ID:
。如果这些被宣布埃尔默认为一个div没有ID或类。它也不会与在这一点上的页相关联。您可以通过使用标签名(例如:标签名更改标签别的东西:李
,会给你&LT的EL;李&GT;&LT ; /李&GT;
)。同样,可以设置EL的id和class。尽管如此埃尔是不是你的页面的一部分。厄尔尼诺属性允许你做EL对象的非常细粒度的操作。大部分时间我使用 EL:$(someElementInThePage)
这实际上结合所有您在您的视图当前页面做EL操纵。否则,如果你想看到所有已在您的视图作出的努力显示出来,你需要插入/追加到该页面的其他地方在您的视图页面上(可能在渲染)。我喜欢把EL作为容器,你所有的观点操纵。
When you create a view you can manipulate the el in four ways using el:
, tagName:
, className:
, and id:
. If none of these are declared el defaults to a div without id or class. It is also not associated with the page at this point. You can change the tag to something else by using using tagName (e.g. tagName: "li"
, will give you an el of <li></li>
). You can set the id and class of el likewise. Still el is not a part of your page. The el property allows you to do very fine grain manipulation of the el object. Most of the time I use an el: $("someElementInThePage")
which actually binds all the manipulation you do to el in your view to the current page. Otherwise if you want to see all the hard work you have done in your view show up on the page you will need to insert/append it to the page somewhere else in your view (probably in render). I like to think of el as the container that all your view manipulates.
这篇关于Backbone.View&QUOT; EL&QUOT;混乱的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!