Question

正如标题所说，当使用orderBy和ng-repeat时，我无法达到预期的行为。

这是我要订购的清单：

<div class = 'row' ng-repeat = 'tabla_salarial in master.tablas_salariales | orderBy:-fecha'>
    <div class = 'col'><p><label>{{tabla_salarial.fecha  | date:dd-MM-yyyy }}</label></p></div>
    <div class = 'col'><p><span>{{tabla_salarial.salario_bruto | number : 2 }}€</span></p></div>
    <div class = 'col'><p><span>{{tabla_salarial.finiquito_vacaciones | number : 2 }}€</span></p></div>
    <div class = 'col'><p><span>{{tabla_salarial.finiquito_indemnizacion | number : 2 }}€</span></p></div>
    <div class = 'col'><p><span>{{tabla_salarial.precio_sustitucion | number : 2 }}€</span></p></div>
</div>

这是控制器内部应该处理列表插入的代码片段：

$http.post("controlador/TablaSalarial/insert", $scope.tabla_salarial).then(function(response){
    if ( response.data.errno ){
        Dialog.toast(response.data.err);
    }
    else{
        RowService.add(response.data.row, "tablas_salariales");
        $scope._dialog.hide();
        $scope.t = {};
        $scope.master.tablas_salariales.push(response.data.row);
    }
}, function(response){/*...*/});

该表在开始时是正确排序的，但每次推送新记录时，它都会附加在表的末尾，尽管所有其他项目都会保留订单。

我知道如何制定不同的方法，或者使用新的指令，而这不是我想要的。

有没有办法让它按预期工作？（并且我的意思是，在推送新记录时保持列表顺序）

提前致谢。

Answer 1

嗯，您的代码中存在一些错误：

您应该在orderBy 过滤器中使用单引号：

<div class="row" ng-repeat="tabla_salarial in master.tablas_salariales | orderBy: '-fecha'">

date 过滤器也应该有单引号：

<div class="col"><p><label>{{tabla_salarial.fecha  | date:'dd-MM-yyyy' }}</label></p></div>

正在使用演示：

＆＃13;

angular.module('app', [])
  .controller('mainCtrl', function($scope) {
    $scope.products = [];

    var start = new Date(2012, 0, 1);
    $scope.add = function(times) {
      times = times || 1;
      for (var i = 1; i <= times; i++) {
        $scope.products.push({
          "id": i,
          "expiresOn": new Date(start.getTime() + Math.random() * (new Date().getTime() - start.getTime())),
          "price": parseFloat(Math.min(100 + (Math.random() * (999 - 100)),999))
        });
      }
    }
    
    $scope.add(5);
  });

＆＃13;

<html ng-app="app">

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>
</head>

<body ng-controller="mainCtrl">
  <table>
    <caption>Products table</caption>
    <thead>
    <tr>
      <th>Id</th>
      <th>Expires On</th>
      <th>Price</th>
    </tr>
    </thead>
    <tbody>
      <tr ng-repeat="product in products | orderBy: '-date'">
        <td ng-bind="product.id"></td>
        <td ng-bind="product.expiresOn | date: 'dd-MM-yyyy'"></td>
        <td ng-bind="product.price | currency: '€': 2"></td>
      </tr>
    </tbody>
  </table>
  <hr>
  <button type="button" value="add" ng-click="add()">Add new product</button>
</body>

</html>

＆＃13;

注意：而不是使用number过滤器并手动插入符号，例如：

<div class = 'col'><p><span>{{tabla_salarial.salario_bruto | number : 2 }}€</span></p></div>

您可以使用currency 过滤器，如下所示：

<div class = 'col'><p><span>{{tabla_salarial.salario_bruto | currency: '€': 2" }}</span></p></div>

我希望它有所帮助！

ng-repeat sort在推送

1 个答案: