Question

我有一个交易数据列表，我提供搜索输入，以便用户可以查看特定的交易类型和日期。在ng-repeat消耗的原始JSON数据中，事务date字段是unix时间戳。

出于显示目的，时间戳通过自定义日期格式过滤器传递，该过滤器将其转换为人类可读的格式。

{{item.date | formatDate}}

现在，在搜索输入中，输入的术语是查看预过滤的数据，而不是过滤后的数据（即搜索3月31日失败，但搜索时间戳按预期工作）。

除了在源JSON中创建新的dateFormatted字段外，有没有办法指示搜索过滤查看过滤后的数据？还有其他解决方案吗？

谢谢！

Answer 1

您可以为此目的创建自定义过滤器，请参阅下面的演示

＆＃13;

var app = angular.module('app', []);

app.controller('firstCtrl', function($scope, $filter) {

  $scope.data = [

    {
      id: 1,
      date: 1426628579
    }, {
      id: 2,
      date: 1425628539
    }, {
      id: 3,
      date: 1426668529
    }, {
      id: 4,
      date: 1433934000
    },

  ];



});

app.filter('transactionDay', function() {
  return function(items, search) {
    var filtered = [];

    if (search === undefined) {
      return items
    }

    for (var i = 0; i < items.length; i++) {
      var transactionDate = new Date(items[i].date * 1000);
      search = new Date(search)
      if (transactionDate.getYear() == search.getYear() && transactionDate.getMonth() == search.getMonth() && transactionDate.getDay() == search.getDay()


      ) {
        filtered.push(items[i]);
      }
    }
    return filtered;
  };
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>


<body ng-app="app">
  <div ng-controller="firstCtrl">
    <input type="text" ng-model="search" /> 
    <br/>
    Search for {{search}}
    <hr/>

    <h4> Filtered </h4>

    <p ng-repeat="item in data | transactionDay : search">id: {{item.id}} | date: {{item.date*1000 | date }}</p>

    <h4> Unfiltered </h4>
    <p ng-repeat="item in data">id: {{item.id}} | date: {{item.date*1000 | date }}</p>
  </div>

＆＃13;

搜索未格式化的日期

1 个答案: