Como posso obter uma matriz invertida em angular? Estou tentando usar o filtro orderBy, mas ele precisa de um predicado (por exemplo, 'nome') para classificar:
<tr ng-repeat="friend in friends | orderBy:'name':true">
<td>{{friend.name}}</td>
<td>{{friend.phone}}</td>
<td>{{friend.age}}</td>
<tr>
Existe uma maneira de reverter a matriz original, sem classificar. Curtiu isso:
<tr ng-repeat="friend in friends | orderBy:'':true">
<td>{{friend.name}}</td>
<td>{{friend.phone}}</td>
<td>{{friend.age}}</td>
<tr>
ng-repeat
comportamento! @ Trevor Senior fez um bom trabalho.Respostas:
Eu sugeriria usar um filtro personalizado como este:
Que pode ser usado como:
Veja-o aqui: Demonstração Plunker
Esse filtro pode ser personalizado para atender às suas necessidades, conforme necessário. Eu forneci outros exemplos na demonstração. Algumas opções incluem verificar se a variável é uma matriz antes de executar o inverso ou torná-la mais branda para permitir a reversão de mais coisas, como seqüências de caracteres.
fonte
items.reverse()
modifica a matriz em vez de apenas criar uma nova e devolvê-la.slice()
para resolver esse problema.if (!angular.isArray(items)) return false;
para verificar se possui uma matriz antes de tentar revertê-la.Isto é o que eu usei:
Atualizar:
Minha resposta foi boa para a versão antiga do Angular. Agora você deveria estar usando
ng-repeat="friend in friends | orderBy:'-'"
ou
from https://stackoverflow.com/a/26635708/1782470
fonte
track by
, esta a única maneira que funcionou para mimng-repeat="friend in friends | orderBy:'+': true track by $index"
Desculpe por trazer isso à tona depois de um ano, mas há uma solução nova e mais fácil , que funciona para o Angular v1.3.0-rc.5 e posterior .
É mencionado nos documentos : "Se nenhuma propriedade for fornecida, (por exemplo, '+'), o próprio elemento da matriz será usado para comparar onde a classificação". Portanto, a solução será:
ng-repeat="friend in friends | orderBy:'-'"
oung-repeat="friend in friends | orderBy:'+':true"
Essa solução parece ser melhor porque não modifica uma matriz e não requer recursos computacionais adicionais (pelo menos em nosso código). Eu li todas as respostas existentes e ainda prefiro essa a elas.
fonte
v1.3.0-rc.4
). Se alguém tiver a chance de experimentá-lo no novo lançamento, informe-nos!v1.3.0-rc.5
( rc.5 docs vs rc.4 docs ). Atualizei a respostaorderBy:'+':true
,orderBy:'-':true
,orderBy:'-':false
,orderBy:'+':false
:(Você pode reverter pelo parâmetro $ index
fonte
$index
). Estou no Angular 1.1.5.ng-repeat="friend in friends | orderBy:'id':true"
funciona.Solução simples: - (não é necessário fazer nenhum método)
fonte
Você pode simplesmente chamar um método no seu escopo para revertê-lo, assim:
Observe que o
$scope.reverse
cria uma cópia da matriz, poisArray.prototype.reverse
modifica a matriz original.fonte
Se você estiver usando o 1.3.x, poderá usar o seguinte
Exemplo Listar livros por data de publicação em ordem decrescente
fonte: https://docs.angularjs.org/api/ng/filter/orderBy
fonte
Se você estiver usando o angularjs versão 1.4.4 e superior , uma maneira fácil de classificar é usar o " $ index ".
ver demonstração
fonte
Ao usar o MVC no .NET com Angular, você sempre pode usar OrderByDecending () ao fazer sua consulta db assim:
Em seguida, no lado angular, ele já será revertido em alguns navegadores (IE). Ao oferecer suporte ao Chrome e ao FF, você precisará adicionar orderBy:
Neste exemplo, você classificaria em ordem decrescente na propriedade .Id. Se você estiver usando paginação, isso ficará mais complicado, pois somente a primeira página será classificada. Você precisaria lidar com isso por meio de um arquivo de filtro .js para seu controlador ou de alguma outra maneira.
fonte
Você também pode usar .reverse (). É uma função de matriz nativa
<div ng-repeat="friend in friends.reverse()">{{friend.name}}</div>
fonte
reverse
inverte a matriz no lugar, ela não retorna apenas uma cópia invertida. Isso significa que toda vez que isso for avaliado, a matriz será revertida.Isso porque você está usando o objeto JSON. Quando você enfrentar esses problemas, altere seu objeto JSON para JSON Array Object.
Por exemplo,
fonte
O
orderBy
filtro executa uma classificação estável a partir do Angular 1.4.5. (Consulte a solicitação de recebimento do GitHub https://github.com/angular/angular.js/pull/12408 .)Portanto, é suficiente usar um predicado constante e
reverse
definido comotrue
:fonte
Eu encontrei algo parecido com isto, mas em vez de matriz eu uso objetos.
Aqui está minha solução para objetos:
Adicione filtro personalizado:
Que pode ser usado como
Se você precisar de suporte antigo ao navegador, precisará definir a função de redução (disponível apenas no ECMA-262 mozilla.org )
fonte
Eu mesmo fiquei frustrado com esse problema e, por isso, modifiquei o filtro criado pelo @Trevor Senior, pois estava com um problema no meu console dizendo que ele não podia usar o método reverso. Eu também queria manter a integridade do objeto, porque é isso que o Angular está usando originalmente em uma diretiva ng-repeat. Nesse caso, usei a entrada de stupid (key) porque o console fica chateado ao dizer que há duplicatas e, no meu caso, eu precisava rastrear por $ index.
Filtro:
HTML:
<div ng-repeat="items in items track by $index | reverse: items">
fonte
Estou adicionando uma resposta que ninguém mencionou. Eu tentaria fazer o servidor fazê-lo, se você tiver um. A filtragem do lado do cliente pode ser perigosa se o servidor retornar muitos registros. Porque você pode ser forçado a adicionar paginação. Se você tiver paginação a partir do servidor, o filtro do cliente no pedido estará na página atual. O que confundiria o usuário final. Portanto, se você tiver um servidor, envie o pedido com a chamada e deixe o servidor devolvê-lo.
fonte
Dica útil:
Você pode inverter sua matriz com Js de baunilha: yourarray .reverse ()
Cuidado: o reverso é destrutivo, por isso mudará sua matriz, não apenas a variável.
fonte
Eu sugeriria que usar o método reverso nativo da matriz é sempre uma melhor escolha do que criar filtro ou usar
$index
.Plnkr_demo .
fonte