angularJS:嵌套的ng-repeat,orderBy不工作

时间:2018-05-29 15:07:02

标签: angularjs

我正在使用angular尝试在嵌套的ng-repeat(在它们两者上)上使用orderBy,但是没有成功。请看一下:

这是我的观点:

<article class="unaTienda"
    ng-repeat="tienda in resumenesRondaInventariosPorTienda | orderBy: ID_CO" >
    <h3 class='bold'>{{tienda[0][0].nombreTienda}}</h3>
    <article class="unDocumento" ng-repeat="documento in tienda[$index]" >
        <h3>{{documento.tipoDocumento}} {{documento.numeroDocumento}}</h3>
    </article>
</article>

这是我对该视图的模型,$ scope.resumenesRondaInventariosPorTienda:

    {  
   "0":[  
      [  
         {  
            "ID_CO":20,
            "nombreTienda":"GIRARDOT",
            "fechaDocumento":"20151204",
            "tipoDocumento":"IF",
            "numeroDocumento":1,
            "unidades":-12,
            "pesos":-128517
         },
         {  
            "ID_CO":20,
            "nombreTienda":"GIRARDOT",
            "fechaDocumento":"20180409",
            "tipoDocumento":"IF",
            "numeroDocumento":16,
            "unidades":5,
            "pesos":28870
         }
      ]
   ],
   "1":[  
      [  
         {  
            "ID_CO":2,
            "nombreTienda":"PLAZA CAICEDO",
            "fechaDocumento":"20160115",
            "tipoDocumento":"IF",
            "numeroDocumento":1,
            "unidades":-8,
            "pesos":84701
         },
         {  
            "ID_CO":2,
            "nombreTienda":"PLAZA CAICEDO",
            "fechaDocumento":"20180417",
            "tipoDocumento":"IF",
            "numeroDocumento":16,
            "unidades":-6,
            "pesos":-59361
         }
      ]
   ]
}

2 个答案:

答案 0 :(得分:0)

您的reverse nested aggregation是一个应该是数组的对象。

重新操纵您的数据

curl -X POST "localhost:9200/test_example/user/_search?pretty&size=1" -H 'Content-Type: application/json' -d'
{
  "query": {},
  "aggs": {
    "filtered": {
      "filter": {
        "bool": {
          "should": [],
          "must_not": [],
          "must": []
        }
      },
      "aggs": {
        "5": {
          "terms": {
            "field": "answers.5",
            "size": 500
          },
          "aggs": {
            "filtered": {
              "filter": {
                "bool": {
                  "should": [],
                  "must_not": [],
                  "must": []
                }
              },
              "aggs": {
                "6": {
                  "terms": {
                    "field": "answers.6",
                    "size": 500
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}
'

然后在你看来它应该是这样的

$scope.resumenesRondaInventariosPorTienda

答案 1 :(得分:0)

John说得对,因为最好先将对象数据放入数组中,然后在标记中对其进行排序(更容易)。我的假设是你不能搞乱数据结构......

原来如此!如果您需要执行自定义过滤功能 - 请转到:

Plunkr

&#13;
&#13;
// I like to wrap my JS files in IIFE's per the John Papa Style Guide

(function() {

  "use strict";

  let app = angular.module('myApp', []);

  app.filter('resumenes', resumenesFunc);

  app.controller('myCtrl', myCtrlFunc);

  myCtrlFunc.$inject = ["$scope"];

  // Custom Filter Function
  function resumenesFunc() {
    return function(resumenes) {
      let resumenesArr = [];

      // Putting the resumenes into a single Array
      for (let resumenIndex in resumenes) {
        let innerArr = resumenes[resumenIndex];

        innerArr.forEach(r => {
          resumenesArr.push(r);
        })
      }

      return resumenesArr.sort(function(a, b) {
        return a.numeroDocumento - b.numeroDocumento;
      });
    }
  }

  // Controller Function
  function myCtrlFunc($scope) {
    $scope.resumenesRondaInventariosPorTienda = {
      "1": [{
        "ID_CO": 1,
        "nombreTienda": "UNICENTRO CALI",
        "fechaDocumento": "20160126",
        "tipoDocumento": "IF",
        "numeroDocumento": 1,
        "unidades": -19,
        "pesos": -213310
      }, {
        "ID_CO": 1,
        "nombreTienda": "UNICENTRO CALI",
        "fechaDocumento": "20180423",
        "tipoDocumento": "IF",
        "numeroDocumento": 16,
        "unidades": -2,
        "pesos": -11485
      }],
      "2": [{
        "ID_CO": 2,
        "nombreTienda": "PLAZA CAICEDO ",
        "fechaDocumento": "20160115",
        "tipoDocumento": "IF",
        "numeroDocumento": 1,
        "unidades": -8,
        "pesos": 84701
      }, {
        "ID_CO": 2,
        "nombreTienda": "PLAZA CAICEDO ",
        "fechaDocumento": "20160223",
        "tipoDocumento": "IF",
        "numeroDocumento": 2,
        "unidades": -25,
        "pesos": -556909
      }]
    }
  }

})()
&#13;
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title>AngularJS Test App</title>

  <link data-require="bootstrap@3.3.7" data-semver="3.3.7" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
  <link rel="stylesheet" href="style.css" />

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script data-require="bootstrap@3.3.7" data-semver="3.3.7" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.20/angular.js" data-semver="1.3.20"></script>

  <script src="app.js"></script>

</head>

<body>
  <h2>Custom Filter - Resumenes</h2>
  <div ng-app="myApp" ng-controller="myCtrl" ng-init="quantity = 10; cost = 5">
    <article ng-repeat="tienda in resumenesRondaInventariosPorTienda | resumenes">

      <!-- Custom Filter returns an array rather than an object - so no need for the second repeat -->
      <article class="unDocumento">
        <h3>{{tienda.tipoDocumento}} {{tienda.numeroDocumento}}</h3>
      </article>

    </article>
  </div>
</body>

</html>
&#13;
&#13;
&#13;

修改:我忘了提到自定义过滤器会返回一系列简历 - 所以请注意我在标记中取出了第二个ng-repeat。我们正在为此数据对象执行过滤器函数中的所有工作...我们没有理由添加额外的标记。

免责声明:我没有进入疯狂的细节(也就是错误处理等等;你可以根据需要添加它们)。 =)