Backbone.js 和 node.js：如何在 <select></select> html 中显示我的数据

Question

你好，我是 node.js 和主干.js 的新手，我的开发编程需要你的帮助..

我的文学作品：http://coenraets.org/blog/2012/10/creating-a-rest-api-using-node-js-express-and-mongodb/

我有代码：

node.js // mongodb数据库

server.js

app.get('/class',function(req, res) {
console.log('show all data in class');
db.collection('ak_classroom', function(err, collection) {
    collection.find().toArray(function(err, items) {
        res.send(items);
    });
}); 
});

main.js

var AppRouter = Backbone.Router.extend({
routes: {
"class" : "show_class",
},
show_class: function(page) {
    var p = page ? parseInt(page, 10) : 1;
    var classList = new ClassCollection();
    classList.fetch({success: function(){
        $("#content").html(new classView({model: classList, page: p}).el);
    }});
    this.headerView.selectMenuItem('home-menu');
 },
});

utils.loadTemplate(['show_class_View'], function() {
app = new AppRouter();
Backbone.history.start(); 
});

在models.js中

//=== 用于获取我的链接数据库 mongodb get /class

window.class = Backbone.Model.extend({
urlRoot: "/class",

idAttribute: "_id",
//my default variable in databsae
defaults: {
    _id: null,
    sch_id : "",
cls_name: "",
    cls_description: "",
    cls_active: "",
}}); 
//get collection database 
window.classCollection = Backbone.Collection.extend({

model: Class,
url: "/class" });

在 classlist.js 中

window.classView = Backbone.View.extend({

initialize: function () {
    this.render();
},

render: function () {
    var class = this.model.models;
    var len = class.length;
    var startPos = (this.options.page - 1) * 100;
    var endPos = Math.min(startPos + 100, len);

    $(this.el).html('<table id="content"><thead><tr><th>ID School</th><th>Name class</th><th>Description</th></tr></thead></table>');

    for (var i = startPos; i < endPos; i++) {
        $('.content', this.el).append(new show_class_View({model: class[i]}).render().el);
    }

    return this;
}
});


window.show_class_View = Backbone.View.extend({
tagName: "tr",

initialize: function () {
    this.model.bind("change", this.render, this);
    this.model.bind("destroy", this.close, this);
},

render: function () {
    $(this.el).html(this.template(this.model.toJSON()));
    return this;
}
});

show_class_View.html

<table width="200" border="1">
  <tbody>
  <tr>
    <td><%= sch_id %></td>
    <td><%= cls_name %></td>
    <td><%= cls_description %></td>
    <td><%= cls_active %></td>
  </tr>
  </tbody>
</table>

这个场景是成功的，但我的问题是如何为

创建数据

<select name="cls_name"  value="<%= cls_name %>">
<option><%= class[i].cls_name %></option>
</select>

选择数据的数组中的选择类名在哪里？？

我是backbone.js 的新手，所以我不知道架构？？请帮助我混淆

Answer 1

我的第一个猜测是您需要有一个适当的下划线模板才能使您的选择发生。像这样的：

<script type="text/template" id="rate_select_template">
    <select id="rate-selector">
        <% rates.each(function(rate) { %>
            <option value="<%= rate.get('duration') %>"><%= rate.get('duration') %></option>
        <% }); %>
    </select>
</script>

• 您可以在此处查看一个工作示例： http://jsfiddle.net/ambiguous/AEqjn/
• 这里是下划线模板文档：http://documentcloud.github.io/underscore/#template