2016-03-07 43 views
1

我不明白爲什麼我的orderBy過濾器根本不工作,我已經看過每一個怪異的解決方案,所有指向事實上,ng-repeat正在對象的對象而不是對象的數組上運行。但是,我的是對象的數組,如下所示:AngularJS orderBy儘管在一個對象數組ng-repeat重複不工作

[Object, Object, Object] 

0: Object 
    $$hashKey: "object:19" 
    dataLink: "" 
    id: "633" 
    name: "My first graph" 
    order: 1 
    parentTarget: "" 
    presenceLink: "" 
    size: 12 
    span: 1 
    subType: 1 
    type: 1 
    __proto__: Object 
1: Object 
    $$hashKey: "object:20" 
    dataLink: "" 
    id: "634" 
    name: "My second graph" 
    order: 2 
    parentTarget: "" 
    presenceLink: "" 
    size: 6 
    span: 1 
    subType: 1 
    type: 3 
__proto__: Object 
2: Object 
    $$hashKey: "object:21" 
    dataLink: "" 
    id: "635" 
    name: "My third graph but in front" 
    order: 1 
    parentTarget: "" 
    presenceLink: "" 
    size: 12 
    span: 0 
    subType: 1 
    type: 1 
__proto__: Object 

那麼怎麼來的,這是不工作:

<ul class="row graphs-list"> 
    <li class="col-xs-12 col-sm-6 col-md-{{graph.size}} graphs-item" ng-repeat="graph in ds.graphs | orderBy:'graph.order'"> 
    <pre> 
     {{graph.order}} 
    </pre> 
    <h5 class="graph-name" ng-bind="graph.name"></h5> 
    <am-menu host="graph" options="graphs"></am-menu> 
    <nvd3 options="gv.options[gv.getTypeFromId(graph.type)]" data="gv.data[gv.getTypeFromId(graph.type)]"></nvd3> 
    </li> 
</ul> 

任何想法?

回答

3

角的orderBy看起來已經指定鍵as you can see here當前對象的內部,所以你只要給鑰匙,像這樣:

<li class="col-xs-12 col-sm-6 col-md-{{graph.size}} p-x-md p-y-sm bg-light graphs-item" ng-repeat="graph in ds.graphs | orderBy:'order'"> 
+0

所以很難發現小姐。在超過一千重複這個是我第一次搞砸了哈哈。謝謝! – Chrillewoodz

1

嘗試。

function Main($scope) { 
 
    $scope.items = [ 
 
     { 
 
     id: "633", name: "My first graph",order: 8, parentTarget: "", 
 
     presenceLink: "",size: 12,span: 1,subType: 1,type: 1 
 
     }, 
 
    { 
 
     id: "634",name: "My second graph", order: 2,parentTarget: "", 
 
     presenceLink: "",size: 6,span: 1,subType: 1,type: 3 
 
    } 
 
    ]; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app> 
 
    <div ng-controller="Main"> 
 
    <ul class="row graphs-list"> 
 
    <li ng-repeat="item in items | orderBy:'order'"> 
 
    <pre> 
 
     {{item.order}} 
 
    </pre> 
 
    </li> 
 
</ul> 
 
    </div> 
 
</div>

1

你可以試試這個了:)

(function(angular) { 
    'use strict'; 
angular.module('orderByExample', []) 
    .controller('ExampleController', ['$scope', function($scope) { 
    $scope.graphs = 
     [{id:'633', name:"My first graph", order:1}, 
     {id:'634', name:"My Second graph", order:4}, 
     {id:'635', name:"My Third graph", order:5}, 
     {id:'636', name:"My Fourth graph", order:6},]; 
    }]); 
})(window.angular); 
在HTML頁面

<body ng-app="orderByExample"> 
    <div ng-controller="ExampleController"> 
    <table class="friend"> 
    <tr> 
     <th>Name</th> 
     <th>Phone Number</th> 
     <th>Age</th> 
    </tr> 
    <tr ng-repeat="graph in graphs | orderBy: 'order'"> 
     <td>{{graph.id}}</td> 
     <td>{{graph.name}}</td> 
     <td>{{graph.order}}</td> 
    </tr> 
    </table> 
</div> 
</body>