Javascript 带数字字段的Angular Js orderBy不工作

在控制器中，我编写了将秩转换为浮点的代码

details.rank = '';
$scope.order = function (predicate) {
    $scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false;
    if (predicate == 'rank') {
        for (var i = 0; i < data.countries[$scope.index].cities.length; i++) {
            details.rank = parseFloat(data.countries[$scope.index].cities[i].rank);
        }
        $scope.predicate = predicate;
    } else $scope.predicate = predicate;
};

在html中，如果我单击表格标题，它将按升序和降序对表格进行排序，但我无法这样做

<th>
    <a href="" ng-click="order('rank')">RANK</a>
    <span ng-show="predicate === 'rank'" ng-class="{reverse:reverse}">     </span>
</th>
<ul ng-repeat="city in countryType">
    <li ng-repeat="details in city.data.cities | orderBy:predicate:reverse">
        <div class="text" id="t1"> {{details.name}} </div>
        <div class="text" id="t2"> {{details.rank}}</div>
        <div class="text" id="t3"> {{details.population}} </div>
        <div class="text" id="t4"> {{details.language}}</div>
    </li>
</ul>

{{details.name}
{{details.rank}
{{details.population}
{{details.language}

您可以通过单击标题div进行动态排序，如下所示：

<ul ng-repeat="city in countryType">
    <li>
        <div class="text" ng-click="orderListBy('name')"> Name </div>
        <div class="text" ng-click="orderListBy('rank')"> Rank</div>
        <div class="text" ng-click="orderListBy('population')"> Population </div>
        <div class="text" ng-click="orderListBy('language')"> Language</div>
    </li>
    <li ng-repeat="details in city.data.cities | orderBy:predicate:reverse">
        <div class="text" id="t1-{{$index}}"> {{details.name}} </div>
        <div class="text" id="t2-{{$index}}"> {{details.rank}}</div>
        <div class="text" id="t3-{{$index}}"> {{details.population}} </div>
        <div class="text" id="t4-{{$index}}"> {{details.language}}</div>
    </li>
</ul>

这样做将在重新单击列的标题时恢复排序

---

PS：别忘了在ng repeat指令中动态命名您的ID，以避免错误，并具有有效的HTML代码。

一切正常，我只想将json文件中的rank字段转换为float或int值，以便我能够排序。

详细信息

仅存在于ng repeat范围中，因此，如果使用$scope.details.name，controllerokay中不再有

details

，那么它也会给我类似于TypeError的错误：无法设置未定义的$scope.details的属性'rank'，当然未定义，它只是ng repeat指令作用域中的一个变量，所以在controller中，我认为您应该编辑原始数据，可能

$scope.city.data.cities

如果未定义

详细信息

，请确保在使用它之前定义它。我认为您使用的是

“使用严格的”

。Make:

var-details={}位于文件的顶部
<ul ng-repeat="city in countryType">
    <li>
        <div class="text" ng-click="orderListBy('name')"> Name </div>
        <div class="text" ng-click="orderListBy('rank')"> Rank</div>
        <div class="text" ng-click="orderListBy('population')"> Population </div>
        <div class="text" ng-click="orderListBy('language')"> Language</div>
    </li>
    <li ng-repeat="details in city.data.cities | orderBy:predicate:reverse">
        <div class="text" id="t1-{{$index}}"> {{details.name}} </div>
        <div class="text" id="t2-{{$index}}"> {{details.rank}}</div>
        <div class="text" id="t3-{{$index}}"> {{details.population}} </div>
        <div class="text" id="t4-{{$index}}"> {{details.language}}</div>
    </li>
</ul>

//initialize values
$scope.predicate = 'rank';
$scope.reverse = false;

$scope.orderListBy = function(attr){
    $scope.predicate = attr;
    $scope.reverse = !$scope.reverse;
};