AngularJS ngRepeat ORDERBY在Chrome [英] AngularJS ngRepeat orderBy in Chrome

问题描述

我有一个简单的应用程序，显示了角的数据行。当控制器最初加载数据，我要对行出现在它们添加到我的行排列顺序相同。因此，排序依据属性将初始设置为空字符串。单击列标题应该再设置排序依据属性设置为合适的值。

I have a simple app that shows rows of data in Angular. When the controller is initially loaded with data, I want the rows to appear in the same order they were added to my rows array. So, the orderBy property will initially be set to an empty string. Clicking on the column header should then set the orderBy property to the appropriate value.

下面是我的小提琴： http://jsfiddle.net/fLjMR/3/

下面是我的JS：

function ctrl($scope)
{
    var rows = [];
    for(var i = 10;i < 30;i++)
    {
        rows.push({name: "Fake Name " + i, email: "fakeemail" + i + "@gmail.com"});
    }

    $scope.rows = rows;
    $scope.orderBy = "";
};

下面是我的HTML：

<table ng-app ng-controller="ctrl">
    <thead>
        <th><a ng-click="orderBy='name'">Name</a></th>
        <th><a ng-click="orderBy='email'">Email</a></th>
    </thead>
    <tbody>
        <tr ng-repeat="row in rows | orderBy:[orderBy]">
            <td>{{row.name}}</td>
            <td>{{row.email}}</td>
        </tr>
    </tbody>
</table>

当我这样做，在IE和FF，行intially出现在添加它们的顺序，但是当我在Chrome做到这一点，中间的项目（在这种情况下，行＃20）出现在列表的开头。这是为什么？

When I do this in IE and FF, the rows intially appear in the order they were added, but when I do it in Chrome, the middle item (in this case row #20) appears at the beginning of the list. Why is this?

推荐答案

如果你只有你那时命令你可以只是字符串传递到过滤器，而不是一个数组一个属性：

If you only have one property that you order by then you can pass just the string to the filter rather than an array:

<tr ng-repeat="row in rows | orderBy:orderBy">

这篇关于AngularJS ngRepeat ORDERBY在Chrome的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！