不知道如何使用模板中的骨幹陣列的對象，並強調模板

我有一個集合，其中的數據返回看起來像：不知道如何使用模板中的骨幹陣列的對象，並強調模板

{ 
    "departments": ["Customer Support", "Marketing"], 
    "classes": ["Planning", "Drawing"] 
}

我不是太清楚如何使用下劃線模板循環到每個輸出的部門，現在我正在使用._each，但我的輸出是object Object。任何人都可以建議如何解決這個問題？

小提琴：http://jsfiddle.net/kyllle/aatc70Lo/7/

模板

<script type="text/template" class="js-department"> 
    <select> 
     <% _.each(departments, function(department) { %> 
      <option value="<% department %>"><% department %></option> 
     <% }) %> 
    </select> 
</script>

var Department = Backbone.Model.extend(); 

var Departments = Backbone.Collection.extend({ 
    model: Department, 
    parse: function(response) { 
     return response; 
    } 
}); 

var DepartmentView = Backbone.View.extend({ 
    template: '.js-department', 

    initialize: function() { 
     console.log('DepartmentView::initialize', this.collection.toJSON()); 
    }, 

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

var departments = new Departments({ 
    "departments": ["Customer Support", "Marketing"] 
}, {parse:true}); 

var departmentView = new DepartmentView({ 
    collection: departments 
}); 

document.body.innerHTML = departmentView;

來源

2015-11-06 styler

你甚至不打電話render()，因此您的模板甚至永遠不會執行，並且object Object輸出與您的模板無關。
在運行render()，你會發現
template: '.js-department'
不起作用，因爲它不是木偶，和骨幹將不會爲你選擇編譯的HTML。所以，你會像這樣的東西替代它：
template: _.template($('.js-department').html())
然後，你將不得不實現this.collection是一個數組，那只有一個項目，所以如果你只是想呈現的是第一項，您將發送給它模板：
this.$el.html(this.template(this.collection.first().toJSON()));
然後你將不得不實現departmentView是一個Backbone.View實例對象，而不是html本身。它具有el屬性，它是此視圖實例的DOM元素，以及$el屬性，它是與jQuery一起包裝的相同DOM元素。
document.body.innerHTML = departmentView.el仍然不起作用，因爲innerHTML需要一個字符串。所以你可以做一些像
document.body.appendChild(departmentView.el);或
departmentView.$el.appendTo(document.body);與jQuery。
（最後一個工作render必須return this）

工作的jsfiddle：http://jsfiddle.net/yuraji/zuv01arh/

來源

2015-11-06 19:22:16 Yura

不知道如何使用模板中的骨幹陣列的對象，並強調模板

回答

相關問題