22

Ok ребята так у меня есть этот массив ключевых значений пары, которые я использую в моей модели:
петли в Underscore JS TEMPLATE

var acs = [{'label':'input box'},{'label':'text area'}]; 

остальная часть кода происходит следующим образом

var Action = Backbone.Model.extend({}); 
var action = new Action(acs); 
var ActionView = Backbone.View.extend({ 
    tagName:"li", 
    template: _.template($('#actions-template').html()), 
    events:{ 
     "click":"makeInput" 
    }, 
    render:function(){ 
     $(this.el).html(this.template(this.model.toJSON())); 
     $(".hero-unit>ul").append(this.el); 
     return this; 
    }, 
    makeInput:function(){ 
     alert("im in"); 
    } 
}); 
var actionView = new ActionView({model:action}); 
actionView.render(); 

Вопрос касается взгляда. Как я могу перебрать модели я передаю, если это мнение я хочу иметь

<script type="text/template" id="actions-template"> 
<% _.each(action, function(acs) { %> 
    <a class="btn"><%= label %></a> 
<% }); %> 
</script> 

Существует что-то не так с моей точки зрения, и петля, я считаю. Любые подсказки? Спасибо!

+0

http://stackoverflow.com/questions/4778881/how-to-use-underscore-js-as-a-template-engine имеет довольно много решений. – Pramod

ответ

28

Вы, вероятно, хотите, чтобы сделать две вещи:

  1. корректируют данные, которые Вы обеспечиваете шаблона:

    $(this.el).html(this.template({ 
        action: this.model.toJSON() 
    })); 
    
  2. Adjust внутреннюю часть шаблона использовать acs.label вместо label:

    <a class="btn"><%= acs.label %></a> 
    

Демонстрация: http://jsfiddle.net/ambiguous/xczBy/

С другой стороны, я думаю, вы должны работать с коллекцией, а не с одной моделью. Вы хотели бы добавить следующее:

var ActionCollection = Backbone.Collection.extend({ 
    model: Action 
}); 

А затем настроить render использовать this.collection:

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

А потом начать вещи, как это:

var actions = new ActionCollection(acs); 
var actionView = new ActionView({collection: actions}); 

И, наконец, см actions в шаблоне:

<% _.each(actions, function(acs) { %> 

Демо: http://jsfiddle.net/ambiguous/6VeXk/

Это лучше соответствовать модели Backbone, основанные ключ/значение.

+0

да! большое спасибо – climboid

+0

один маленький вопрос, хотя, почему это действие: this.model.toJSON()? – climboid

+1

@climboid: Ваша модель была массивом (что нечетно в Backbone), и вам нужно указать ему какое-то имя или шаблон не сможет ссылаться на него. Модели обычно представляют собой пары ключей/значений (более или менее), поэтому значения получают имена по умолчанию. Переключение в коллекцию (как в моем обновленном ответе) будет иметь больше смысла. –