在角度控制器中迭代JSON數組

我想遍歷Json中的數組並在前端顯示值。我已經給了我的代碼，但我無法弄清楚我究竟在哪裏錯了。我無法檢索數組中的值（startDate，endDate）並在前端顯示它們。在角度控制器中迭代JSON數組

JSON

"reportTypeObligationTypes": [{ 
    "reportTypeId": null, 
     "consolidationScopeId": 4009, 
     "startDate": "2014-01-01", 
     "endDate": "9999-12-31", 
     "frequencyCode": "Q", 
     "reportTypeLabel": null, 
     "reportTypeCode": null, 
     "consolidationScopeCode": "C", 
     "frequencyLabel": "Quarterly" 
}]

角控制器

xxxApp.controller('reportListController', function ($scope, $http, $location, $routeParams) { 


    var service_url = "/mdmservice/services/reportTypeEntities/" + $routeParams.id; 
    $http.get(service_url).success(

    function (data, status, headers, config) { 
     $scope.reportTypeEntities = data; 
     angular.forEach($scope.reportTypeEntities, function (item) { 
      console.log(item.reportTypeObligationTypes); 
     }) 
    }); 

    $scope.gridOptions = { 
     paginationPageSizes: [25, 50, 100, 200, 300, 400, 500, 1000], 
     paginationPageSize: 25, 
    }; 
    $scope.gridOptions.data = 'reportTypeEntities'; 
    $scope.gridOptions.enableFiltering = true; 
    $scope.gridOptions.enableGridMenu = true; 
    $scope.gridOptions.fastWatch = true; 

    $scope.gridOptions.columnDefs = [{ 
     name: "entityName", 
     width: "35%", 
     cellTemplate: '<div style="margin-left: 5px;">' + ' <a href="#edit/{{row.entity.entityId}}">{{row.entity.entityName}}</a>' + '</div>' 
    }, { 
     name: "entityCode", 
     width: "15%" 
    }, { 
     name: "codeType" 
    }, { 
     name: "Entity Type", 
     field: "entityType.entityTypeName" 
    }, { 
     name: "reportingId" 
    }, { 
     name: "Country", 
     field: "country.countryName" 
    }, { 
     name: "startDate", 
     field: "reportTypeObligationTypes.startDate" 
    }, { 
     name: "endDate", 
     field: "reportTypeObligationTypes.endDate" 
    }, { 
     name: "consolidationScopeCode", 
     field: "reportTypeObligationTypes.consolidationScopeCode" 
    }, { 
     name: "frequencyLabel", 
     field: "reportTypeObligationTypes.frequencyLabel" 
    }, { 
     name: "Delete", 
     cellTemplate: '<div style="margin-left: 5px;">' + ' <a href="#delete/{{row.entity.entityId}}" class="glyphicon glyphicon-trash btn btn-danger"> Delete</a>' + '</div>', 
     enableFiltering: false, 
     enableSorting: false 
    }]; 

})

HTML頁面 - 角UI電網

<div ng-app="xxxApp" ng-controller="reportListController"> 

<p class="heading">Entities with Reporting Obligation</p> 

<!-- Entities list data table using - 'ui-grid' module --> 
<div ui-grid="gridOptions" class="myGrid" ui-grid-pagination 
    ui-grid-selection ui-grid-resize-columns ui-grid-move-columns 
    ui-grid-cellNav ui-grid-exporter></div>

來源

2015-11-13 SGN

您可以使用綁定點的功能，並有一個返回基於你有JSON的數組的函數？ – OliverRadini

請放入html代碼！ –

是否有錯誤訊息？通常使用角度我們使用ng-repeat在html中顯示數組數據。 –

在你的控制，分配$scope.reportTypeObligationTypes = [{JSON}]; 您的代碼或指令，例如：

<div ng-repeat="item in reportTypeObligationTypes"> 
    <div>{{item.startDate}}</div> 
    <div>{{item.endDate}}</div> 
</div>

「項」將代表陣列中的每個JSON對象，你可以使用item.(property)。引用每個對象屬性。

編輯：嘗試：

$scope.gridOptions = { 
    data: $scope.myData, 
    columnDefs: [ 
    { name: 'field1', displayName: 'pretty display name' }, 
    { name: 'field2', visible: false } 
] 
};

來源

2015-11-13 12:15:05 Shinobi881

這應該從SGN發佈的內容開始工作，聽起來像他是角度新手。 –

Hi Shinobi，我在我的html中使用Angular UI網格。 – SGN

ui-grid APi說你應該將數據集合設置爲'$ scope.data = reportTypeObligationTypes'first，然後設置'$ scope.gridOptions.data = $ scope.data' **看看上面的編輯** – Shinobi881

在角度控制器中迭代JSON數組

回答

相關問題