anglejsで適切に配列を選択する方法

Question

複数のプロパティで項目のリストを並べ替える必要があります。だから私は変数にバインドする配列を使用します。

ユーザーがselectで注文オプションを選択できるようになるまで、すべてがうまく動作します。私の配列が1つ以上の値を持っているときにブレークします。デフォルトではtrack by $indexのように見えます。

var myApp = angular.module("myApp", []); 
 

 
myApp.controller("myCtrl", function($scope){ 
 
    $scope.items = [ 
 
\t {a: "3", b: "First"}, 
 
\t {a: "2", b: "Second"}, 
 
\t {a: "1", b: "Third"} 
 
    ]; 
 
    $scope.my_orderby = ['a','b']; 
 
    $scope.my_selected = { 
 
\t a: ['a'], 
 
\t b: ['b'], 
 
\t ab: ['a','b'], 
 
\t ba: ['b','a'] 
 
    }; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
    
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <button ng-click="my_orderby.push(my_orderby.shift())">In place: {{my_orderby}}</button> 
 
    <select ng-model="my_orderby"> 
 
    <option value="{{v}}" ng-repeat="(k,v) in my_selected">{{k}}</option> 
 
    </select> 
 
    <button ng-click="items.push(items.shift())">{{items}}</button> 
 
    <hr/> 
 
    <div ng-repeat="item in items | orderBy:my_orderby track by $index">{{item.a}} {{item.b}}</div> 
 
</div>

どのように私は複数のプロパティでソートできるように行うことになっていますか？

Answer 1

@Poneyは私の答えのための右のリードを与えました。

OPTIONは、arrayをCDATA objectに変換します。 CData配列がどのようなものかはっきりしていませんが、それを避けて私の問題を解決しました。

https://www.w3.org/TR/html401/interact/forms.html#edef-OPTION。

私の配列を維持するために、私はng-changeでng-optionsを組み合わせて、JavaScriptの機能の変化をしなければなりませんでした。

Answer 2

ng-optionsで動作しているようです。私は "値"は、配列として保持する代わりに、文字列に値を変換していると思います。

var myApp = angular.module("myApp", []); 
 

 
myApp.controller("myCtrl", function($scope){ 
 
    $scope.items = [ 
 
\t {a: "3", b: "First"}, 
 
\t {a: "2", b: "Second"}, 
 
\t {a: "1", b: "Third"} 
 
    ]; 
 
    $scope.my_orderby = ['a','b']; 
 
    $scope.my_selected = { 
 
\t a: ['a'], 
 
\t b: ['b'], 
 
\t ab: ['a','b'], 
 
\t ba: ['b','a'] 
 
    }; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
    
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <button ng-click="my_orderby.push(my_orderby.shift())">In place: {{my_orderby}}</button> 
 
    <select ng-model="my_orderby" ng-options="item as index for (index, item) in my_selected"> 
 
    </select> 
 
    <button ng-click="items.push(items.shift())">{{items}}</button> 
 
    <hr/> 
 
    <div ng-repeat="item in items | orderBy:my_orderby track by $index">{{item.a}} {{item.b}}</div> 
 
</div>

Answer 3

これを試してみてください。それがあなたを助けることを願っています。ありがとうございました。

<div ng-repeat="item in items | orderBy:'a'">{{item.a}} {{item.b}}</div>