☰

angular 2 ソートとフィルター 質問する

tag-icon • tag-icon angular typescript
angular 2 ソートとフィルター 質問する

Angularjs 1 では、次の方法で並べ替えとフィルタリングが可能です。

<ul ng-repeat="friend in friends | filter:query | orderBy: 'name' ">
   <li>{{friend.name}}</li>
</ul>

しかし、Angularjs 2.0 でこれを行う方法の例は見つかりませんでした。質問は、Angularjs 2.0 で並べ替えとフィルタリングを行う方法です。まだサポートされていない場合、Angularjs 2.0 にいつ組み込まれるか、または組み込まれるかどうかを知っている人はいますか?

ベストアンサー1

これは、AngularチームがAngular 2を縮小して実行することを望んでいるため、すぐには追加されません。OrderByはリフレクションで実行されるため、縮小化では機能しません。ミシュコ・ヘヴェリーの反応その件について。

私は時間をかけて、単一次元配列と多次元配列の両方をサポートする OrderBy パイプを作成しました。また、多次元配列の複数の列で並べ替えることもサポートしています。

<li *ngFor="let person of people | orderBy : ['-lastName', 'age']">{{person.firstName}} {{person.lastName}}, {{person.age}}</li>

このパイプを使用すると、ページをレンダリングした後に配列にさらに項目を追加し、新しい項目で配列を正しく並べ替えることができます。

私はここでプロセスについて書いてください。

実際に動作するデモはこちらです:http://fuelinteractive.github.io/fuel-ui/#/pipe/orderbyそしてhttps://plnkr.co/edit/DHLVc0?p=info

編集: 新しいデモを追加しましたhttp://fuelinteractive.github.io/fuel-ui/#/pipe/orderby

編集2: ngForを新しい構文に更新しました

おすすめ記事