Underscore.js過濾掉唯一值

Question

這是我的小提琴的鏈接

我有一個表，它是從Ajax響應中獲得的JSON動態創建的。

我在表格中有重復的條目。 例如xxx,xxx 。 我想將它們分組並讓它像<td data-count="some count">xxx</td>

我嘗試使用underscore.js但似乎打破了rowspan功能。

我使用_countBy(arr)將arr轉換為對象，並獲得了以下格式的對象。

{xxx: 2, zzz: 1}

問題 ：如何修改generateTable()函數以適應此更改。 我嘗試按以下方式修改它

var i=0;

$.each(queryObject,function(key,value){
   if(i == 0){
       i++;
       childrenHtml += ('<td rowspan="1" data-count="'+value+'">' + key + '</td>' + '</tr>');
   }
   else{
    childrenHtml += ('<tr><td rowspan="1" data-count="'+value+'">' + key + '</td>' + '</tr>');
   }
});

但是，現在看來，排卷似乎是個問題。 我怎么修改這個？

Answer 1

你需要制作這樣的函數來轉換你的數據並將其分組：

  _.chain(data.result)
    .keys()//get all the keys buildname1 buildname2..etc
    .flatten()
    .each(function(key) {//for each key do a mapping and return a grouping.
      data.result[key] = _.chain(data.result[key]).flatten().map(function(d) {
        var key = _.chain(d).keys().first().value();
        var ob = {};
        ob[key] = _.chain(d).values().flatten().groupBy().value();//grouping by value
        return ob;
      }).value();
    }).value();

這會將您的數據集轉換為以下格式：

{
   "buildname1":[
      {
         "table1":{
            "xxx":[
               "xxx"
            ],
            "zzz":[
               "zzz",
               "zzz"
            ]
         }
      },
      {
         "table2":{
            "xxx":[
               "xxx"
            ],
            "yyy":[
               "yyy"
            ]
         }
      }
   ],
   "buildname2":[
      {
         "table1":{
            "xxx":[
               "xxx",
               "xxx"
            ],
            "zzz":[
               "zzz"
            ]
         }
      },
      {
         "table2":{
            "xxx":[
               "xxx",
               "xxx"
            ]
         }
      },
      {
         "table3":{
            "xxx":[
               "xxx"
            ],
            "yyy":[
               "yyy"
            ]
         }
      }
   ]
}

然后，您需要更改制作表格的biz邏輯，並計算rowspan。

在這里工作代碼