Javascript 如何使用淘汰js对数据进行分组

我想使用knockout js对数据进行分组。 我是这样拉小提琴的

但是当我将字符作为可观察数组（）时 没有显示。我能告诉我可能的问题吗

Html:

js:

ko.bindingHandlers.groupby={
makeTemplateValueAccessor:函数（valueAccessor）{
var bindingValue、GroupedArray、Group、key、key、obj、ObjectsGroup、_i、_j、_len、_len1、_ref、，
_这个=这个；
bindingValue=ko.utils.unwrapobbservable（valueAccessor（））；
组={}；
_ref=bindingValue.group；
对于（_i=0，_len=_ref.length；_i<_len；_i++）{
obj=_ref[_i]；
key=bindingValue.by（obj）；
如果（组[键]==无效0）{
组[键]=[obj]；
}否则{
组[键]。推送（obj）；
}
}
keys=（函数（）{
var_结果；
_结果=[]；
用于（在组中输入）{
_结果：按键；
}
返回结果；
})();
if（bindingValue.sort的类型=='function'）{
key.sort（bindingValue.sort）；
}else if（bindingValue.sort的类型=='string'）{
if（bindingValue.sort===“升序”）{
keys.sort（）；
}else if（bindingValue.sort==='descending'）{
keys.sort（）；
键。反转（）；
}
}
GroupedArray=[]；
对于（_j=0，_len1=keys.length；_j<_len1；_j++）{
键=键[_j]；
objectsInGroup=groups[key]；
objectsInGroup.$key=key；
groupedArrays.push（objectsInGroup）；
}
返回函数（）{
返回{
foreach:groupedarray，
templateEngine:ko.nativeTemplateEngine.instance
};
};
},
init:function（元素、valueAccessor、allBindingsAccessor、viewModel、bindingContext）{
返回ko.bindingHandlers.template.init（元素、valueAccessor、allBindingsAccessor、viewModel、bindingContext）；
},
更新：函数（元素、valueAccessor、allBindingsAccessor、viewModel、bindingContext）{
var newValueAccessor；
newValueAccessor=ko.bindingHandlers.groupby.MakeMemplateValueAccessor（valueAccessor）；
返回ko.bindingHandlers.template.update（元素、newValueAccessor、allBindingsAccessor、viewModel、bindingContext）；
}
};
var模型={
this.Characters=ko.array([
{
‘年份’：‘2014年’，
“月”：“七月”，
“模块”：“巡回”
},
{
‘年份’：‘2014年’，
“月”：“七月”，
“模块”：“操作”
},
{
‘年份’：‘2014年’，
“月”：“六月”，
“模块”：“重复”
},
{
‘年份’：‘2013年’，
“月”：“六月”，
“模块”：“注意”
},
{
‘年份’：‘2015年’，
“月”：“七月”，
“模块”：“联系人”
},
{
‘年份’：‘2013年’，
“月”：“五月”，
“模块”：“联系人”
}
]);
};
ko.应用绑定（模型）；

存在许多问题，例如Viewmodel对象的属性无效，因为“=”而不是“：”，然后属性以perenthesis结束

还有一个问题是Groupby自定义绑定预期的数组，而您正在传递observableArray

<div data-bind="
  groupby: { 
    group: Characters(),//Pass Array
    by: function (character) { return character.year; },
    sort: 'descending'
}">

ko.bindingHandlers.groupby = {
makeTemplateValueAccessor: function(valueAccessor) {
  var bindingValue, groupedArrays, groups, key, keys, obj, objectsInGroup, _i, _j, _len, _len1, _ref,
    _this = this;
  bindingValue = ko.utils.unwrapObservable(valueAccessor());
  groups = {};
  _ref = bindingValue.group;
  for (_i = 0, _len = _ref.length; _i < _len; _i++) {
    obj = _ref[_i];
    key = bindingValue.by(obj);
    if (groups[key] === void 0) {
      groups[key] = [obj];
    } else {
      groups[key].push(obj);
    }
  }
  keys = (function() {
    var _results;
    _results = [];
    for (key in groups) {
      _results.push(key);
    }
    return _results;
  })();
  if (typeof bindingValue.sort === 'function') {
    keys.sort(bindingValue.sort);
  } else if (typeof bindingValue.sort === 'string') {
    if (bindingValue.sort === 'ascending') {
      keys.sort();
    } else if (bindingValue.sort === 'descending') {
      keys.sort();
      keys.reverse();
    }
  }
  groupedArrays = [];
  for (_j = 0, _len1 = keys.length; _j < _len1; _j++) {
    key = keys[_j];
    objectsInGroup = groups[key];
    objectsInGroup.$key = key;
    groupedArrays.push(objectsInGroup);
  }
  return function() {
    return {
      foreach: groupedArrays,
      templateEngine: ko.nativeTemplateEngine.instance
    };
  };
},
init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
  return ko.bindingHandlers.template.init(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext);
},
update: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
  var newValueAccessor;
  newValueAccessor = ko.bindingHandlers.groupby.makeTemplateValueAccessor(valueAccessor);
  return ko.bindingHandlers.template.update(element, newValueAccessor, allBindingsAccessor, viewModel, bindingContext);
}
};

var Model = {
this.Characters = ko.observableArray([
    {
        'year': "2014",
        'month': "july",
        'module':'tour'
    },
    {
        'year': "2014",
        'month': "july",
        'module':'action'
    },
      {
        'year': "2014",
        'month': "june",
        'module':'duplicate'
    },
    {
        'year': "2013",
        'month': "june",
        'module':'note'
    },
    {
        'year': "2015",
        'month': "july",
        'module':'contact'
    },
    {
        'year': "2013",
        'month': "may",
        'module':'contact'
    }
]);
};

ko.applyBindings(Model);

<div data-bind="
  groupby: { 
    group: Characters(),//Pass Array
    by: function (character) { return character.year; },
    sort: 'descending'
}">