簡體   English   中英

根據嵌套值對角度ng重復列表進行排序

[英]Sort an angular ng-repeat list based on nested value

如何從片段屬性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>

如果你想按Skärm屬性排序,你必須像這樣定義排序表達式:

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

Plunker

看起來像angular在表達式中使用的非ASCII符號有一些問題。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM