2014-11-08 10 views
7

Ho una lista che registra i nomi precedenti che ho scelto come mostrato di seguito. Quello che voglio è che la lista mostri sempre solo gli ultimi 5 risultati, tuttavia quello che ho al momento è mostrare i primi 5 in ordine di tempo con gli ultimi per primi. Come può essere realizzato?angularjs mostra gli ultimi 5 articoli in ng-repeat list

http://jsfiddle.net/sfqo2fn3/1/

<div ng-controller="MyCtrl"> 
     <input type="text" ng-model="updatedname" /> 
     <input type="button" value="Change name" ng-click="changeName(updatedname)"/> 
     <br/> 
      Hello, {{name}}! 
    <ul> 
     <li ng-repeat="name in nameLog | limitTo:5 | orderBy:'time':true">{{name.value}} - {{name.time}}</li> 
    </ul>  
    </div> 

    var myApp = angular.module('myApp',[]); 
    myApp.factory('UserService', function() { 
       var _nameLog = []; 
       var userService = {}; 
       userService.name = "John"; 
       userService.ChangeName = function (value) { 
        userService.name = value; 
       }; 
       userService.logName = function (value) { 
        _nameLog.push ({ 
         "value":value, 
         "time" :Date.now() 
        }); 
       }; 
       userService.getNameLog = function(){ return _nameLog; } 
     return userService; 
    }); 

    function MyCtrl($scope, UserService) { 
     $scope.name = UserService.name; 
     $scope.updatedname=""; 
     $scope.changeName=function(data){ 
      $scope.updateServiceName(data); 
     } 
     $scope.updateServiceName = function(name){ 
      UserService.ChangeName(name); 
      UserService.logName(name); 
      $scope.name = UserService.name; 
      $scope.nameLog = UserService.getNameLog(); 
     } 
    } 

risposta

34

Si può fare: | limitTo: -5

<li ng-repeat="name in nameLog | limitTo:-5 | orderBy:'time':true">...</li> 

Da documentation:

limite: La lunghezza della matrice o stringa restituita. Se il numero limite è positivo, vengono copiati il ​​numero limite di elementi dall'inizio della matrice/stringa sorgente. Se il numero è negativo, vengono copiati il ​​numero limite di elementi dalla fine dell'array/della stringa di origine. Il limite verrà tagliato se supera array.length

2

È possibile creare un filtro personalizzato per questo. Ho modificato il vostro violino un po ':

http://jsfiddle.net/sfqo2fn3/2/

myApp.filter('slice', function() { 
    return function(arr, start, end) { 
     if(!end) { 
      return (arr || []).slice(start); 
     } 
     return (arr || []).slice(start, end); 
    }; 
}); 

ora avete un filtro "fetta" che filtro per visualizzare solo gli ultimi 5 elementi nella matrice.

Problemi correlati