0

感谢您帮助学习如何做到这一点,假设我有一个类似于这个的代码。

骨干脚本:

$(function(){
  var Band = Backbone.Model.extend();
    var BandList = Backbone.Collection.extend({
    model: Band,
    url: 'feed1.json'
  });

  var BandsView = Backbone.View.extend({
    template: _.template($('#bandlist_template').html()),
    render: function(eventName) {
      _.each(this.model.models, function(band){
        var lTemplate = this.template(band.toJSON());

        $(this.el).append(lTemplate);
      }, this);
      return this;
    }
  });

  var lBands = new BandList;

  var AppView = Backbone.View.extend({
    el: "body",

    render: function(){
      var lBandsView = new BandsView({model:lBands});
      var lHtml = lBandsView.render().el;
      $('#bands').html(lHtml);
    },

    initialize: function(){
      var lOptions = {};
      lOptions.success = this.render;
      lBands.fetch(lOptions);
    }
  });

  var App = new AppView;
});

下划线js模板:

<script type="text/template" id="bandlist_template">
  <?php echo "hello"; ?><li><%= band_name %> - <%= section %></li>
</script>

HTML:

<ul id="bands">
</ul>

杰森:

[
  {
    "id": "149",
    "band_name": "Armthorpe Elmfield",
    "section": "Fourth"
  },
  {
    "id": "127",
    "band_name": "Barnsley Chronicle",
    "section": "Second"
  },
  {
    "id": "155",
    "band_name": "Barnsley Metropolitan Band",
    "section": "Fourth"
  }
]

好的。假设我想css根据json section属性更改样式(只需要放 div 和样式只有 jsonsection属性'Fourth')。那么如何过滤该属性并将其推送到另一个主干 js 中填充div在同一ul.

就像这个:

<ul id="bands">
</li>Armthorpe Elmfield - <div class="styled">Fourth</div><li>
</li>Barnsley Chronicle - Second<li>
</li>Barnsley Metropolitan Band - <div class="styled">Fourth</div><li>
</ul>
4

1 回答 1

0

您拥有所需的一切,只需使用模板:

<script type="text/template" id="bandlist_template">
    <?php echo "hello"; ?>
    <li><%= band_name %> - 
        <% if section is 'Fourth': %>
            <div class="styled">Fourth</div>
        <% else: %>
            <%= section %>
        <% end %>
    </li>
</script>

当然,它可以做得更好,但只是为了证明这一点if和其他控制结构在您的模板中工作没有问题。(在示例中,我在 if 中使用eco语法,如果需要,只需将其修复为使用普通 javascript)。

于 2012-10-22T14:53:20.167 回答