ngtable：入れ子オブジェクトのソートとフィルタリング

Question

ngTableを持つテーブルに表示するオブジェクトのリストがあります。私は、フィールドのラベル」と「nestObject.label」にソートやフィルタリングできるようにしたい私のコントローラで

obj {label:string, 
    nestObj{nestLabel:string 
      } 
    } 

： 私のオブジェクトは次のようになります。私はこれを試してみました：

Uncaugth syntexError：予期しないトークン

$scope.tableParams = new ngTableParams({ 
     page: 1,   // show first page 
     count: 10, 
     filter: { 
      label='', 
      nestObj.label='' 
     }, 
     sorting: { 
      label: 'asc', 
      nestObj.label: 'asc' 
     } 
    }, { 
     total: data.length, // length of data 
     getData: function($defer, params) { 
      // use build-in angular filter 
      var filteredData = params.filter() ? 
      $filter('filter')(data, params.filter()) : 
      data; 
      var orderedData = params.sorting() ? 
        $filter('orderBy')(filteredData, params.orderBy()) : 
        data; 

      params.total(orderedData.length); // set total for recalc pagination 
      $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
    }   
}); 

しかし、私はエラーを取得して、Mは、JavaScriptのコンパイラはnestObj.labelにフィルタを好きではありません。

nestObj.labelでフィルタリングしてソートしないとうまく機能します。

ngTableを使用してネストしたオブジェクトをフィルタリングして並べ替えることはできますか？

ここには、問題を示すplunkerがあります。

ありがとうございます。

Answer 1

ネストされたオブジェクトによるフィルタリングと並べ替えは、現在ng-tableでは適切ではありません。このpostと@Kostia Mololkinの解決策を読んで、私は最終的にこのバグを避ける方法を得ました。そして解決策は非常に簡単です。彼に大きな感謝！ は今、それはだ、あなたがplunkerにここにこのソリューションを見ることができます

for (var i = 0; i < data.length; i++) { 
    data[i].town = ""; //initialization of new property 
    data[i].town = data[i].adresse.town; //set the data from nested obj into new property 
} 

：

は、私は自分のデータである配列を書き直し：新しいプロパティを初期化などの新しいプロパティにネストされたオブジェクトからのデータを設定します魅力のように働いています...

Answer 2

私が遭遇したように私の2セントを追加するだけで、関数型プログラミングを利用することを恐れないでください。データをフラット化すると、きれいそうのような単純な、私の意見である：

var flattenedArray = dataArray.map(function(obj) { 
    return { 
     label: obj.label, 
     nestedLabel: dataItem.nestedObj.nestedLabel 
    }; 
}); 

その後、あなたは簡単にngTableにlabelとnestedLabelで並べ替えることができます。

注：ここではコピーを作成しているため、少しメモリが消費されています。

Answer 3

ネストされたパラメータと注文とページングの追加サポートをサポートする方法は、getDataです。 $filterを注入し、myDataの名前を自分のデータ配列に変更する必要があります。それが役立つことを願っています。

$scope.tableParams = new NgTableParams({}, 
{ 
    getData: function($defer, params) { 

     // organize filter as $filter understand it (graph object) 
     var filters = {}; 
     angular.forEach(params.filter(), function(val,key){ 
      var filter = filters; 
      var parts = key.split('.'); 
      for (var i=0;i<parts.length;i++){ 
       if (i!=parts.length-1) { 
        filter[parts[i]] = {}; 
        filter = filter[parts[i]]; 
       } 
       else { 
        filter[parts[i]] = val; 
       } 
      } 
     }) 

     // filter with $filter (don't forget to inject it) 
     var filteredDatas = 
      params.filter() ? 
       $filter('filter')(myDatas, filters) : 
       myDatas; 

     // ordering 
     var sorting = params.sorting(); 
     var key = sorting ? Object.keys(sorting)[0] : null; 
     var orderedDatas = sorting ? $filter('orderBy')(filteredDatas, key, sorting[key] == 'desc') : filteredDatas; 

     // get for the wanted subset 
     var splitedDatas = 
      orderedDatas.slice((params.page() - 1) * params.count(), 
       params.page() * params.count()); 

     params.total(splitedDatas.length); 

     // resolve the ngTable promise 
     $defer.resolve(splitedDatas); 
    } 
});