web-dev-qa-db-ja.com

AngularJS ngオプションの並べ替え配列

私はng-options配列内のアイテムの値でアルファベット順にソートされたフォント配列を表示します。

[〜#〜] html [〜#〜]

<select ng-options="font for font in webfonts | orderBy:'font'" name="fonts">
     <option value="">Choose a font</option>
</select>

[〜#〜] js [〜#〜]

$scope.webfonts = [ 
        'Abel', 'Crafty Girls' , 'Lato' , 'Average',
        'Corben', 'Quicksand', ... ];

orderByなどの値を変更してみました。 documentation およびすべてのコメントを読みました。

私は何が欠けていますか?これはオブジェクトでのみ動作するはずですか?

25
Chris Bier

これはあなたがする必要があることです:

_<select ng-model="selected" ng-options="font for font in webfonts | orderBy:'toString()' " name="fonts">
_
  1. Ng-modelを追加して、文字列のリストに対してバインディングが正しく機能するようにする必要があります。
  2. 入力に文字列のリストが含まれている場合は、toString()を使用してソートできます。 orderByの式はGetter関数になる可能性があるためです。この関数の結果は、<、=、>演算子を使用してソートされます。

Demo

50
zs2020

ドキュメントで指定されているように、文字列引数はプリミティブではなくオブジェクトプロパティ用です。音のように基本的なことですが、引数を返すだけの関数をスコープに作成し、orderByに渡す必要があると思います。

jsFiddle !をご覧ください。

3
Steve Klösters