使用 underscore.js 时，innerHTML 'each function' 与 js 文件 'each function'

Question

我想使用 underscore.js 获取数组。

这是我的案例。

view.js

views.list = Backbone.View.extend({
      render: function(templateName) {
        var template = _.template(templateName);
        this.$el.html(template({result : this.collection.models}));
        _.each(this.collection.models, function(model){
          console.log(model.get("id"));
        });
        return this;
      }
    });

运行结果 _.each(this.collection.models, function(model){console.log(model.get("id"));});

list.html

<div id="columns">
      <% _.each(result, function(model){ %>
        <div id="<% model.get("id") %>" class="content">
          <a href="<% model.get("url") %>">
            <figure>
              <img src="<% model.get("imgSrc") %>">
              <figcaption><% model.get("title") %></figcaption>
            </figure>
        </div>
      <% }); %>
      </div>

我向this.collection.model发送了一个参数作为result参数，所以我认为上面的可执行代码和我在html中编写的可执行代码是相同的，但是运行结果不一样。

有什么区别？

Answer 1

您需要在模板中使用输出值的表达式。而不是

<div id="<% model.get("id") %>" class="content">

你需要：

<div id="<%- model.get("id") %>" class="content">

见docs

使用 underscore.js 时，innerHTML 'each function' 与 js 文件 'each function'

innerHTML 'each function' vs js file 'each function' when using underscore.js

javascript

backbone.js

underscore.js

backbone.js-collections

underscore.js-templating