Question

我知道Mustache是一个“逻辑较少”的模板脚本，但可能是我正在寻找的......

想象一下这样的模型：

var users = [{
    {name: "Lorem", isOk: false},
    {name: "Ipsum", isOk: true},
    {name: "Dolor", isOk: false},
    {name: "Sit", isOk: false},
    {name: "Amet", isOk: true}
}];

为用户创建模板时：

{{#users}}
    <p>{{name}}</p>
{{/users}}

它以模型顺序渲染所有内容。

是否有机会先加载isOk: true，然后加载其他人？

我尝试过：

{{#users}}
    {{#isOk}}
    <p>{{name}}</p>
    {{/isOk}}
    {{^isOk}}
    <p>{{name}}</p>
    {{/isOk}}
{{/users}}

但没有改变......

Answer 1

{{#users}}包装整个列表，以便为每个元素重复内容。你必须在列表上迭代两次才能像这样拆分它。

{{#users}}
    {{#isOk}}
    <p>{{name}}</p>
    {{/isOk}}
{{/users}}
{{#users}}
    {{^isOk}}
    <p>{{name}}</p>
    {{/isOk}}
{{/users}}

当然，您可以在运行两次之前将列表分开：

// in js, divide in good & bad, join afterwards
var goodUsers = [], 
    badUsers = [],
    sortedUsers = [];
users.forEach(function(user) {
  if (user.isOk) {
    goodUsers.push(user);
  } else {
    badUsers.push(user);
  }
});
sortedUsers = goodUsers.concat(badUsers);

这样您只需使用一次代码，但需要按排序列表进行操作：

{{#sortedUsers}}
    <p>{{name}}</p>
{{/sortedUsers}}

小胡子js订购

1 个答案: