Question

我有一张桌子，并且在<td> <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>的所有行，除了最后一行。

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，并且在控制器中必须创建该函数：

$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

Answer 2

使用：

  <tr ng-repeat="receipt in $data">
   <td   data-title="voucher number" ng-hide="$index == $data.length - 1">
    <span>{{receipt.voucher_no}}</span> 
   </td>
    <td   data-title="voucher date" ng-hide="$index == $data.length - 1">
    <span>{{receipt.voucher_date}}</span> 
   </td>
    <td   data-title="voucher Amount">
    <span>{{receipt.voucher_amount}}</span> 
   </td> 
  </tr>

$ index变量存储重复元素在原始列表中的位置。

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

2 个答案: