50

次のユーザーがいるとします。

$scope.users = {
  "2": {
    email: 'john@gmail.com',
    name: 'John'
  },
  "3": {
    email: 'elisa@gmail.com',
    name: 'Elisa'
  }
}

<select>次のオプションを使用してを作成したいと思います。

<option value="3">Elisa</option>
<option value="2">John</option>

つまり、ユーザーは名前でソートする必要があります。

構文を使用して次のことを試しました(key, value) in expressionが、機能しません。

<option ng-repeat="(user_id, user) in users | orderBy:'user.name'" 
        value="{{ user.id }}">
  {{ user.name }}
</option>

実例はこちら。

私は何が欠けていますか?

と互換性のないng-options私が使用するソリューションを提案しないでください。ui-select2ng-options

4

3 に答える 3

55

著者の回答がリンクで参照しているスレッドでこれを見ることができますが、言及された回避策の1つをSOに掲載することをお勧めします。

これが技術的に実装されていないことは事実ですが、データ モデルを少し変更したい場合は、簡単な回避策があります。カスタム フィルターを使用して、オブジェクトのプロパティの配列を生成します (置換なし)。オブジェクトにキー フィールド (上記の場合は「id」) を追加すると、探している動作を取得できるはずです。

app.filter("toArray", function(){
    return function(obj) {
        var result = [];
        angular.forEach(obj, function(val, key) {
            result.push(val);
        });
        return result;
    };
});
...

$scope.users = {
    1: {name: "John", email: "john@gmail.com", id: 1},
    2: {name: "Elisa", email: "elisa@gmail.com", id: 2}
};

使用できる ng-repeat ディレクティブは次のとおりです。

<option value="{{user.id}}" ng-repeat="user in users | toArray | orderBy:'name'">{{user.name}}</option>

そして、これがplunkrです。

orderByフィルタは ではnameなくパラメータとして受け取ることに注意してくださいuser.name

残念ながら、オブジェクトにidプロパティを追加すると、それを含むオブジェクトのキーとの不一致が生じる可能性があります。

回答で言及したリンクには、その場でユーザーオブジェクトにプロパティを作成する提案されたソリューションもありますが、idこのアプローチは少し面倒ではないように感じます (データレプリケーションの導入を犠牲にして)。

于 2013-09-22T00:17:07.603 に答える
9

OK、答えが見つかりました:

まだ実装されていません:(

于 2013-02-19T10:33:37.820 に答える
0

受け入れられた回答に追加してデータ形式を確認すると、データを次のように変換する必要があります

app.filter('myFilterUsers',function(){
    return function(data)
    {
        var newRes = [];
        angular.forEach(data,function(val,key){
            val["id"] = key;  //Add the ID in the JSON object as you need this as well.
            newRes.push(val);
        });
        return newRes;
    }
});
于 2016-01-21T13:38:14.053 に答える