Question

我有一个奇怪的结构化对象，我试图将其转换为数组，以便我能够使用带有ng-repeat的过滤器。

以下是一个示例对象：

var sysData = {
"walkerduct": {
    "id": 0,
    "uri": "walkerduct",
    "name": "Walkerduct",
    "imageS": "img/callcenter.jpg",
    "imageL": "img/callcenter.jpg",
    "copy": "Walkerduct info",
    "relatedSys": [],
    "relatedApp": []
 }
}

我的控制器，我尝试将其转换为数组，

inFloorControllers.controller('ApplCtrl', ['$scope', '$routeParams',
function ($scope, $routeParams) {
    //alert("OtherCtrl hit");
    $scope.appData = appData;
    $scope.sysData = sysData;
    $scope.title = appData.title;
    $scope.sysArr = [];
    var hasData = true;
    var idx = 0;
    while (hasData) {
        var data = sysData[idx];
        alert("yo");
        if (data) {
            $scope.sysArr.push(data);
            idx++;
        }
        else {
            hasData = false;
        }
    }
    for (i = 0; i < $scope.sysArr.length; i++) {
        alert($scope.sysArr[i]);
    }
}
]);

最后是我的HTML，

<div ng-repeat="sys in sysArr | limitTo:3">
    <a href=#/systems/{{sys.uri}}>{{sys.name}}</a>
</div>

我没有看到我做错了什么......它甚至没有击中if(data) ...谢谢。

Answer 1

只需将Object.keys与Array.map结合使用，就像这样：

inFloorControllers.controller('ApplCtrl', ['$scope', '$routeParams',
function ($scope, $routeParams) {
    $scope.appData = appData;
    $scope.sysData = sysData;
    $scope.title = appData.title;
    $scope.sysArr = Object.keys($scope.sysData).map(function(key){ 
                       return $scope.sysData[key];
                    });
}
]);

如果您需要IE8支持，则需要polyfill for the map function。

Answer 2

这不是一个有效的json。删除最后一个逗号

    {
"walkerduct": {
    "id": 0,
    "uri": "walkerduct",
    "name": "Walkerduct",
    "imageS": "img/callcenter.jpg",
    "imageL": "img/callcenter.jpg",
    "copy": "Walkerduct info",
    "relatedSys": [],
    "relatedApp": []
 }
}

在ng-repeat中使用JS对象的困难时期

2 个答案: