Backbone js:如何删除视图中的额外标签? [英] Backbone js: How to remove extra tag in view?

问题描述

我有以下模板:

<div></div>....

以及以下视图:

 var TestView = Backbone.View.extend({标签名称:div"，模板:$("#tests_template"),初始化:函数(){_.bindAll(this, 'clickbtn');},事件:{"点击.btn": "clickbtn"},渲染:函数(){....{});

问题是，它产生以下输出:

<div><div class="row">...</div></div>

如何去掉外面的div?我尝试从视图中删除 tagName 属性，但它仍然放置了一个 div?

解决方案

更改您的模板以摆脱外部 div:

....

然后，告诉视图使用类名创建 div:

tagName: "div",班级名称:行"

OR 如果您想保留当前模板，请告诉 View 使用哪个 el(假设它已经存在于您页面上的某个位置):

var testView = new TestView({el: $(".row")});

EDIT 您问是否可以在初始化程序中执行此操作?当然可以，但您需要确保挂钩事件:

初始化:函数(){this.el = $(".row");this.delegateEvents();_.bindAll(this, 'clickbtn');}

老实说，前两个选项与 IMO 更加脱钩.

I have the following template:

<div class="row">
  <div></div>
  ....
</div>

and the following view:

    var TestView = Backbone.View.extend({
    tagName: "div",
    template: $("#tests_template"),
    initialize: function () {
        _.bindAll(this, 'clickbtn');
    },
    events:
    {
        "click .btn": "clickbtn"
    },
    render: function () {
            ....
            {
      });

The problem is, it produces the following output:

<div><div class="row">...</div></div>

How do I get rid of the outer div? I tried removing the tagName property from the view but it still puts a div?

解决方案

Change your template to get rid of the outer div:

<div></div>
  ....

Then, tell the view to create the div with a class name:

tagName: "div",
className: "row"

OR if you want to keep the current template, then tell the View which el to use (assuming it exists already some place on your page):

var testView = new TestView({el: $(".row")});

EDIT You asked if you can do this in the initializer? Sure, but you'd need to make sure that you hook the events:

initialize: function () {
    this.el = $(".row");
    this.delegateEvents();
    _.bindAll(this, 'clickbtn');
}

Honestly, though, the first two options are more de-coupled IMO.

这篇关于Backbone js:如何删除视图中的额外标签?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！