javascript - Angularjs int 过滤器在智能表中没有正确排序

Question

我正在使用智能表在我的应用程序中的 View 上显示我的数据(通过 %http.get 通过 json 文件加载)。

在 View 的 Controller 中，我创建了一个过滤器，因为从 json 返回的数据中包含数字，这些数字作为数据类型字符串返回。过滤器尝试将数字作为 INT 数据类型返回，以便智能表的排序功能能够正确地对它们进行排序。

但是无论我尝试什么，智能表排序仍然将值排序为字符串数据类型。

我的 View 称为 Interfaces.html:

<div ng-controller="interfaceController">
    <div class="container">
        <table st-table="displayedCollection" st-safe-src="rowCollection" class="table table-striped" ng-show="displayedCollection">
            <thead>
                <tr>
                    <th st-sort="Name">Interface</th>
                    <th st-sort="Disabled">Disabled</th>
                    <th st-sort="Online">Online</th>
                    <th st-sort="Failed">Failed</th>
                    <th st-sort="Error">Error</th>
                    <th st-sort="Overdue">Overdue</th>
                </tr>
                <tr>
                    <th colspan="4"><input st-search="" class="form-control" placeholder="global search...." type="text"/></th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="row in displayedCollection">
                    <td>{{row.Name}}</td>
                    <td>{{row.Disabled | convertInt | number}}</td>
                    <td>{{row.Online}}</td>
                    <td>{{row.Failed}}</td>
                    <td>{{row.Error}}</td>
                    <td>{{row.Overdue}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

我的 Controller 叫做 interfaceController.js

app.controller('interfaceController',['$scope','$http', function($scope,$http){

    $http.get('app/data/InterfacesAuto.json').success(function(data,status,headers,config){
        $scope.rowCollection = data;

        $scope.displayedCollection = [].concat($scope.rowCollection);
    });

}]);

// Filter takes a value from the table and returns it as an INT
app.filter('convertInt',function(){
    return function (input) {
        this.parseInt = parseInt;
        return (parseInt(input,10));
    };
});

我正在加载的json

[
{"Name":"First","Disabled":"2","Online":"5","Failed":"1","Error":"0","Overdue":"2"},
{"Name":"Second","Disabled":"163","Online":"426","Failed":"7","Error":"0","Overdue":"195"},
{"Name":"Third","Disabled":"0","Online":"1","Failed":"0","Error":"0","Overdue":"0"}
]

我对 angularjs 和网页设计还很陌生，所以在此先感谢您的帮助。

干杯

Answer 1

您需要更改 Controller 中的数据类型。过滤器用于格式化数据以显示给用户。

也许你可以在收到来自服务器的数据后立即将字符串转换为 int(我使用 jquery):

$( data).each(function( index, element ) {
          element.Disabled = parseInt(element.Disabled);
        });

fiddle : http://jsfiddle.net/HB7LU/23575/

我使用过滤器按“已禁用”属性进行排序。

在 Angular 服务中包含此逻辑(ajax 调用和数据处理)也是一个好主意。

希望对您有所帮助。