javascript - 使用ng-repeat时如何在特定行的angularjs中隐藏s

Question

我有一张 table ，还有很多<td> s 在第一 <tr> </tr>我正在使用 ng-repeat

  <tr ng-repeat="receipt in $data">
   <td   data-title="voucher number">
    <span>{{receipt.voucher_no}}</span> 
   </td>
    <td   data-title="voucher date" sortable="'voucher_date'" filter="{'voucher_date': 'text' }">
    <span>{{receipt.voucher_date}}</span> 
   </td>
    <td   data-title="voucher Amount">
    <span>{{receipt.voucher_amount}}</span> 
   </td> 
  </tr>  

我也有像

这样的json数据

{
    "data": [
        {
            "voucher_no": "2",
            "voucher_amount": "100",
            "voucher_date": "2014-05-04",
      },
        {
            "voucher_no": "3",
            "voucher_amount": "1000000",
            "voucher_date": "2014-02-05",
        },
        {
            "voucher_no": "4",
            "voucher_amount": "50000",
            "voucher_date": "2014-02-05",
        },
        .
        .
        .
        .
        {
            "total": 1360100
        }
    ]
}

please note that for final data there is only one field 'total'.

所以对于我要打印的所有行 3 <td> s 除了最后一行。

Answer 1

<tr ng-repeat="receipt in $data | filter:{voucher_date: '2014-05-04'}">
    <!-- Voucher No -->
    <td ng-if="!$last"
        data-title="voucher number">
        <span>{{receipt.voucher_no}}</span> 
    </td>

    <!-- Voucher Date -->
    <td ng-if="!$last"
        data-title="voucher date">
         <span>{{receipt.voucher_date}}</span> 
    </td>

    <!-- Voucher Amount -->
    <td ng-if="!$last"
        data-title="voucher Amount">
        <span>{{receipt.voucher_amount}}</span> 
    </td>

    <!-- Total Column -->
    <td ng-if="$last"
        colspan="3"
        data-title="Total">
        <span>{{receipt.total}}</span> 
    </td>
</tr>

上面的过滤器将只显示日期等于指定日期的记录。

如果你想显示两个日期之间的所有记录，你需要指定一个函数作为过滤器:| filter:filter_between_date 并且在您的 Controller 中您必须创建该函数:

$scope.from_date = '2014-05-04'; // 04 May
$scope.to_date = '2014-05-10'; // 10 May
$scope.filter_between_date = function(item) {
    var item_date = new Date(item.voucher_date).getTime();

    if(item_date >= (new Date($scope.from_date).getTime()) &&
        item_date <= (new Date($scope.to_date).getTime()) {
        return true;
    }

    return false;
};

Angular filter docs

Angular ngIf directive docs

Angular ngRepeat $last property