Javascript handlebar.js自定义函数排序

我用车把来显示评论

{{#each COMMENTS}}
     <div class="heightfix">
          <div class="commentIcon"></div>&nbsp;&nbsp;
             <label id="commentDate1" class="bold">{{COMMENTON}}</label>:&nbsp;
             <label id="commentCreator1" class="bold">{{COMMENTBY_FIRSTNAME}} {{COMMENTBY_LASTNAME}}</label>&nbsp;&nbsp;
             <label class="commentContent" id="commenttext_{{ID}}">{{COMMENTTEXT}}</label>
     </div>                                  
{{/each}}   

{{{#每个评论}
{{评论}}：
{{COMMENTBY_FIRSTNAME}}{{COMMENTBY_LASTNAME}}
{{COMMENTTEXT}}
{{/每个}}

在这些评论中，我有索引。我想按照他们的索引显示评论。 评论0 评论1 评论2 评论3

如何使用自定义函数实现这一点？ 谢谢

方法1：自定义访问器 如果您对上下文有控制权（您可能也有控制权），那么可以使用属性访问器实现这一点。假设您的上下文包含顺序混乱的注释：

var context = {
    comments: [
        { idx:6, text:'violet' },
        { idx:1, text:'orange' },
        { idx:0, text:'red' },
        { idx:5, text:'indigo' },
        { idx:3, text:'green' },
        { idx:2, text:'yellow' },
        { idx:4, text:'blue' },
    ],
};

在呈现模板之前，您可以对

注释
数组进行适当排序（请注意，对于数值，您只需减去它们即可获得自然排序）：

问题是，这将修改上下文对象，而您可能不希望这样做。解决方案是提供一个自定义访问器，该访问器将返回按某个自定义属性排序的注释。我们可以这样做：

Object.defineProperty( context, 'commentsByIdx', {
    get: function() {
        // note that we call concat() to create a copy of
        // the array; otherwise we are modifying the
        // the original array, which is a side effect
        return this.comments.concat()
            .sort( function(a,b) { return a.idx - b.idx } );
    }
});

您可以在此处看到此解决方案的实际应用：

方法2：把手块辅助对象
另一种方法是实现一种新的方法。如果您对上下文没有太多的控制权（或者不想用自定义属性污染上下文），这种方法将工作得更好。只需注册车把辅助对象：

Handlebars.registerHelper('eachByIdx', function(context,options){
    var output = '';
    var contextSorted = context.concat()
        .sort( function(a,b) { return a.idx - b.idx } );
    for(var i=0, j=contextSorted.length; i<j; i++) {
        output += options.fn(contextSorted[i]);
    }
    return output;
});

handlebar.registerHelper（'eachbydx'，函数（上下文，选项）{
var输出=“”；
var contextSorted=context.concat（）
.sort（函数（a，b）{返回a.idx-b.idx}）；
对于（var i=0，j=contextSorted.length；i以下是图像库的排序项目

需要知道


函数需要3个周长

要排序的数据
要排序的值
分类数据的标题

函数返回包含排序数据的html

数据

{
"imageUrl" : "img/shoes.jpg",
"category" : "shoes"
},
{
"imageUrl" : "img/hat.jpg",
"category" : "hat"
}

JS节点排序功能服务器端


调用助手并添加3个参数

第一个参数包括所有要排序的数据
data
第二个参数是要按
'shoes'
第三个参数是排序数据的标题
'Jordans'

这就是你要找的吗？类似，但我想按我自己的索引进行排序和显示。我应该发布更多关于我问题的信息吗？你真是个天才！！两种方法都有效。我更喜欢方法1。你让我明白了。谢谢。
{{#eachByIdx comments}}
    <li>{{text}}</li>
{{/eachByIdx}}

{
"imageUrl" : "img/shoes.jpg",
"category" : "shoes"
},
{
"imageUrl" : "img/hat.jpg",
"category" : "hat"
}

"use strict";
var helpers = module.exports;

helpers.sort = function(data, value, heading) {
var str = '<div class="row">'+
'<div class="container headings">'+
  '<h2 class="center">'+heading+'</h2>'+ // heading data from Markdown
  '<hr>'+
'</div>'+
'<div class="swap"><i class="material-icons">swap_horiz</i></div>'+
'<div class="carousel">';
data.forEach(function(gal){ // loop through all data
if (gal.category === value) {  // sort data by value
 str += '<a class="carousel-item" href="#!"><img src="'+gal.imageUrl+'" alt="gallery_image"></a>'; // gallery item

}
})
str += '</div>'+
        '</div>'+
        '</div>';
return str;  // return sorted html data 
};

 {{#sort data 'shoes' 'Jordans'}}{{/sort}}