在ng-repeat裏面只顯示第一個和最後一個孩子結果

在我的AngularJS應用程序中，我只想顯示ng-repeat中100條記錄列表的第一個和最後一個記錄（按行）。在ng-repeat裏面只顯示第一個和最後一個孩子結果

MY UI

<ul ng-repeat="employees in employee | filter:customFilter"> 
<li>{{employees.emp_id}} </li> 
<li>{{employees.emp_name}} </li>

我的腳本

var app = angular.module('app', []); 
app.controller('Ctrl', function($scope,$rootScope) { 
$scope.employee = [ 
    {emp_id: 1,emp_name: 'Jes'}, 
    {emp_id: 2,emp_name: 'Sandy'}, 
    {emp_id: 3,emp_name: 'King'}, 
    {emp_id: 4,emp_name: 'rks'}, 
    {emp_id: 5,emp_name: 'alex'}, 
    {emp_id: 6,emp_name: 'cathrin'} 
]; 
});

在這裏，我想就先顯示和最後一排像

1 | Jes 
6 | Cathrin

我的工作PLNKR HERE，

我該如何解決這個問題？

在此先感謝。

來源

2016-02-09 Rakesh

使用ng-if與$first || $last

的ngRepeat指令從收集每個項目一次實例化一個模板。每個模板實例都有自己的作用域，其中給定的循環變量設置爲當前收集項目，而$index設置爲項目索引或項目的。

$ first如果重複元素在迭代器中第一個返回true，則返回true。
$ last如果重複元素在迭代器中最後返回，則返回true。

<ul ng-repeat="employees in employee | filter:customFilter" ng-if="$first || $last"> 
    <li>{{employees.emp_id}} </li> 
    <li>{{employees.emp_name}} </li> 
    </ul>

Plunker

來源

2016-02-09 05:54:36

非常感謝。有用。 – Rakesh

你介意接受答案:) –

您還可以使用特殊變量$last（或$first），這是可用的ng-repeat循環中。

$last噹噹前元素是數組中的最後一個元素時，其值爲true。 $first的工作方式相同，但爲第一要素:)蛋糕與$first

來源

2016-02-09 05:58:28

件和$last

看到在行動：

var app = angular.module('app', []); 
 
app.controller('Ctrl', function($scope,$rootScope) { 
 
    $scope.employee = [ 
 
    {emp_id: 1,emp_name: 'Jes'}, 
 
    {emp_id: 2,emp_name: 'Sandy'}, 
 
    {emp_id: 3,emp_name: 'King'}, 
 
    {emp_id: 4,emp_name: 'rks'}, 
 
    {emp_id: 5,emp_name: 'alex'}, 
 
    {emp_id: 6,emp_name: 'cathrin'} \t 
 
    ]; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<body ng-app="app" ng-controller="Ctrl"> 
 
    <ul ng-repeat="employees in employee | filter:customFilter" ng-if="$first || $last"> 
 
    <li>{{employees.emp_id}} | {{employees.emp_name}} </li> 
 
    </ul> 
 
</body>

來源

2016-02-09 06:12:27

在ng-repeat裏面只顯示第一個和最後一個孩子結果

回答

相關問題