Javascript Backbone.js模板示例

如何添加标签名为age的文本框，并使用backbone.js在模板中查看它

<label> Age</label>
<input type = "text" name = "age" value="12"/>

年龄

---

我希望将其作为属性添加到模型中，并在模板中查看它。有人能帮忙吗？我知道backbone.js的基本知识。

不确定您想要什么，但下面是一个基本示例：

var App = {};

App.Person = Backbone.Model.extend({});
App.View = Backbone.View.extend({
    el: "#form",
    render: function() {
        var html = _.template($('#form-tpl').html(), this.model.toJSON());
        this.$el.html(html);
    }
});

$(function() {
    var person = new App.Person({
        name: 'Thomas',
        age: 37
    }),
    app = new App.View({model: person});
    app.render();
});

HTML:

年龄：

---

此外，还有大量的教程可用。祝你好运

模板不是内置于主干网的，这意味着您首先必须选择一个模板系统。有很多好的选择，但我个人更喜欢。您还可以从Mustache、下划线模板函数（非常简约）和多个jQuery插件中进行选择

一旦您选择了一个库，您通常会使用它构建/编译一个模板函数来生成HTML。下面是一个简单的把手示例：

var template = Handlebars.compile('<span>Hello {{target}}</span>');

并返回渲染结果：

resultText == '<span>Hello World!</span>';

resultText==“你好，世界！”；

您可以根据需要将其安装到主干中，但有一种常见模式如下所示：

 var MyView = Backbone.View.extend({
     template: Handlebars.compile('<span>Hello {{target}}</span>'),
     render: function() {
         var valueMap = this.model.toJSON();
         this.$el.html(this.template(valueMap));
     }
 });

 // Usage:
 new MyView({
     el: '#someElement',
     model: new Backbone.Model({target: 'World!'}
 )).render();

var MyView=Backbone.View.extend({
模板：handlebar.compile（'Hello{{{target}'），
render:function（）{
var valueMap=this.model.toJSON（）；
this.el.html（this.template（valueMap））；
}
});
//用法：
新MyView({
el:“#某个元素”，
模型：新主干。模型（{target:'World！'}
)).render（）；

ModemControl:off-on…如何将单选按钮作为属性添加到模型中并在模板中查看..标签、文本框、下拉列表对我来说也很有用..不要使用单选按钮..你能帮助我了解toJSON（）的功能吗是吗？你能告诉我它在这里是干什么的吗？

toJSON

提取模型的属性，以便将其传递到模板中进行渲染。我不明白你试图实现什么。我希望我的模板看起来像Age://textbox/（这已经成功了）ModemControl://2 radiobuttons on n off/…现在dis单选按钮应该作为属性添加到模型中，如age，然后在模板中查看。我已经清除了它，现在我正在尝试创建单选按钮您是对的，模板没有内置到backbonejs中，但是backbonejs对带模板的下划线有很强的依赖性G是内置的。但是，下划线的模板功能仅限于一个非常小的函数。如果你想做的就是把变量放在字符串<代码>中。模板< /代码>是很好的，但是如果你想做一点点逻辑，即使是一个“<代码> >如果< /COD>条件或<代码> < < /Calp>循环，我认为它是必要的。NY严重发展，你需要考虑其他图书馆（如把手）。

var resultText = template({target: 'World!'});

resultText == '<span>Hello World!</span>';

 var MyView = Backbone.View.extend({
     template: Handlebars.compile('<span>Hello {{target}}</span>'),
     render: function() {
         var valueMap = this.model.toJSON();
         this.$el.html(this.template(valueMap));
     }
 });

 // Usage:
 new MyView({
     el: '#someElement',
     model: new Backbone.Model({target: 'World!'}
 )).render();