Question

我现在正在学习lodash。我的目标是使用lodash模板将一组用户输出到我的html表。但是，我无法弄清楚为什么我的模板无效。

我的用户

var users = [
    { 'user': 'fred', 'active': false, 'age': 40 },
    { 'user': 'pebbles', 'active': false, 'age': 1 },
    { 'user': 'barney', 'active': true, 'age': 36 }
];

我的模板

let template4 = _.template('<ul>' +
    '<% _.forEach(users, function(user) { %>' +
    '<li><%- user.user %></li>' +
    '<% }); %>' +
    '</ul>');

let template4Result = template4({ 'users': users }); // I expect => '<ul><li>fred</li><li>pebbles</li><li>barney</li></ul>'

console.log(template4Result);// => '<ul></ul>'

我无法弄清楚我应该如何设计模板，以便循环浏览我的收藏集并为其中的每个用户添加一些HTML代码。

Answer 1

您的示例代码有效;以下是一个正在运行的代码段。

＆＃13;

var users = [
    { 'user': 'fred', 'active': false, 'age': 40 },
    { 'user': 'pebbles', 'active': false, 'age': 1 },
    { 'user': 'barney', 'active': true, 'age': 36 }
];

let template4 = _.template('<ul>' +
    '<% _.forEach(users, function(user) { %>' +
    '<li><%- user.user %></li>' +
    '<% }); %>' +
    '</ul>');

let template4Result = template4({ 'users': users });
console.log(template4Result);

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

＆＃13;

问题在于，您传递到模板中的users变量中没有任何项目。因此，您无法获得您期望的数据。

如果您要异步检索用户（通过AJAX调用），那么一旦ajax调用返回，您就需要使用回调来生成模板。下面是伪 - 示例（ajax不是真正的接口）。

ajax.get(function(users) {
    // this would be the "success" callback
    // we're now able to render the template since we have the data

    let template4Result = template4({ 'users': users });
})

Answer 2

你可以试试这个：

let template4 = _.template('<ul>' +
'<% _.forEach(users, function(value, key) { %>' +
'<li><%- value.user %></li>' +
'<% }); %>' +
'</ul>');

lodash _.template（）输出错误

2 个答案: