下划线模板变量 - 刚开始

下划线模板看起来很简单，但我正在努力尝试第一次，并且难住了。下划线模板变量 - 刚开始

我只是想在H1中显示一个人的名字。

这里是我的模板：

<script id="tmpl-index-list" type="text/template"> 
<% _.each(data, function(item){ %> 
    <li> 
     <a href="#person" data-transition="slide"> 
      <h1><%=item.personName%></h1> 
     </a>  
    </li> 
<% }); %>

这是我的JS：

var tmplMarkup = $('#tmpl-index-list').html(); 
var compiledTmpl = _.template(tmplMarkup, {data: IndexList.listEntries}); 
$('#index-list-wrapper').html(compiledTmpl);

IndexList.listEntires是一个ListEntry对象，简单的键/值对象的数组。

例如，这里是“类”：

function ListEntry(){ 
    this.img_url = ''; 
    this.personName = ''; 
    this.personID = ''; 
};

当我做了console.dir就可以了，数据是存在的，但对于item.personName在模板中，它出现为未定义。

我错过了什么？

在此先感谢。

来源

2012-12-14 Tim Snyder

查看你在控制台中得到了什么：'<％_.each（data，function（item）{console.log（item）％>' –

'item'是一个数组，但是项目[0]出现未定义。 –

请发布一些精确的“IndexList.listEntries”示例内容 – mVChr

我相信问题出在您传递的数据上。您正在使用IndexList.listEntries，但您尚未提供任何示例数据。

根据您的意见，该listEntries是一个对象数组，如ListEntry，我已经放在一起的一些示例数据。

var IndexList = { 
    listEntries : [ 
     { 
      "img_url" : "http://www.gravatar.com/avatar/72b3fbc4d71d3955deca44483322da23?s=32&d=identicon&r=PG", 
      "personName" : "Tim", 
      "personId" : "Tim76" 
     }, 
     { 
      "img_url" : "http://www.gravatar.com/avatar/0927a92a180a7552e2119742ede9b9cf?s=128&d=identicon&r=PG", 
      "personName" : "Rob", 
      "personId" : "Robert Price" 
     } 
    ] 
};

使用此数据时，您的模板在运行时正确显示“Tim”和“Rob”作为列表项。

我建议你去看看你试图使用的IndexList数据，问题几乎肯定存在。

来源

2012-12-20 18:25:52

下划线模板变量 - 刚开始

回答

相关问题