根据嵌套值对角度ng重复列表进行排序

时间:2013-09-26 12:24:58

标签: javascript angularjs

如何从片段属性skärm的嵌套值中对ng-repeat列表进行排序: 我的控制器看起来像这样:

'use strict';

/* Controllers */

function PhoneListCtrl($scope){
    $scope.phones = [

        {"name" : "Samsung Galaxy S4",
         "snippet" : {  "Operativsystem" : "Android 4.2.2",
                            "Skärm" : "4,99 tum",
                            "CPU" : "Quad-core 1,6GHz",
                            "Kamera, bak" : "13 MP",
                            "Kamera, fram" : "1,9 MP",
                            "Övrigt" : "Närfältskommunikation (Eng. near field communication, NFC)"
                            },
            "date" : "2012-04-27T00:00:00.000Z"
        },


        {"name" : "iPhone 5",
          "snippet" : { "Operativsystem" : "iOS 7",
                            "Skärm" : "4 tum",
                            "CPU" : "Apple A6 1,3GHz dual core",
                            "Kamera, bak" : "8 MP",
                            "Kamera, fram" : "1,2 MP",
                            "Övrigt" : "-"
                           },
            "date" : "2012-09-21T00:00:00.000Z"
        },

                {"name" : "iPhone 5s",
          "snippet" : { "Operativsystem" : "iOS 7",
                            "Skärm" : "42 tum",
                            "CPU" : "Apple A7 1,3 GHz dual core",
                            "Kamera, bak" : "8 MP",
                            "Kamera, fram" : "1,2 MP",
                            "Övrigt" : "-"
                           },
            "date" : "2013-09-20T00:00:00.000Z"
        }
    ]


};

基于字母和日期的排序有效,但我如何使用Skärm的嵌套值作为排序参数?

        <b>Sort by:  </b> 
        <select ng-model="sortByProp">
            <option value="name">Alfabetiskt</option>
            <option value="date">Nyast</option>
            <option value="snippet.Skärm">Skärmstorlek</option>
        </select>

    </div>
    <div class="span10">
        <h1>The future of mobile devices</h1>

        <ul class="phonesListing">
        <li ng-repeat="phone in phones | filter:query | orderBy:sortByProp">
            <h3>{{phone.name}}</h3>
            <ul>
                <li ng-repeat="(key,value) in phone.snippet">
                    <b>{{key}}:</b>     {{value}}
                </li>
            </ul>
        </li>
        </ul>
        <p>Total number of phones: {{phones.length}}</p>
    </div>

1 个答案:

答案 0 :(得分:2)

如果你想按Skärm属性排序,你必须像这样定义排序表达式:

 <option value="snippet['Skärm']">Skärmstorlek</option>

Plunker

看起来像角度在表达式中使用的非ASCII符号有些问题。