1. ホーム
  2. ジャバスクリプト

[解決済み】角度付きng-repeatの逆再生

2022-04-04 04:19:41

質問

angularで逆配列を取得するには? orderByフィルターを使おうとしていますが、ソートするために述語(例えば'name')が必要です。

<tr ng-repeat="friend in friends | orderBy:'name':true">
      <td>{{friend.name}}</td>
      <td>{{friend.phone}}</td>
      <td>{{friend.age}}</td>
<tr>

ソートせずに、元の配列を反転させる方法はありますか? というような。

<tr ng-repeat="friend in friends | orderBy:'':true">
      <td>{{friend.name}}</td>
      <td>{{friend.phone}}</td>
      <td>{{friend.age}}</td>
<tr>

解決方法は?

このようなカスタムフィルタを使用することをお勧めします。

app.filter('reverse', function() {
  return function(items) {
    return items.slice().reverse();
  };
});

というように使うことができます。

<div ng-repeat="friend in friends | reverse">{{friend.name}}</div>

動作はこちらでご確認ください。 プランカーデモンストレーション


このフィルターは、お客様のニーズに合わせて自由にカスタマイズすることができます。デモの中で他の例も紹介しています。逆変換を行う前に変数が配列であることを確認したり、文字列などより多くのものの逆変換を可能にするためにより甘くしたりするオプションもあります。