Question

我的控制器定义如下，方法是getEmployeeDetails：

var app = angular.module('app');
app.controller('AppController',[ '$scope', '$http', function($scope, $http) {

    $scope.result = [];
    $scope.getEmployeeDetails = function() {
        var response = $http.get('http://localhost:8080/empMgt/employee/all');
        response.success(function(data, status, headers, config) {
            $scope.result.push(data);
        });
        response.error(function(data, status, headers, config) {
            alert( "Exception details: " + JSON.stringify({data: data}));
        });
    };

    $scope.getEmployeeDetails();
}]);

此方法获取一个返回的结果对象，其中包含员工列表。我试图在我的HTML中的表格中显示该列表。

html如下：

<body ng-controller="AppController" style="display:none">
    {{result}}
    <table>
        <tr>
            <th>EmployeeId</th>
            <th>ProjectId</th>
            <th>Employee Name</th>
            <th>Employee Address</th>
        </tr>
        <tr ng-repeat="employee in result.listOfEntities">
            <td>{{employee.employeeId}}</td>
            <td>{{employee.projectId}}</td>
            <td>{{employee.employeeName}}</td>
            <td>{{employee.employeeAddress}}</td>
        </tr>
    </table>
</body>

html中的对象很好，因为我打印的相同。该表未在表行中进行迭代。

返回的数据如下所示：

{
    "result": true,
    "resultCode": "SUCCESS",
    "listOfEntities": [{
        "employeeId": "1",
        "projectId": "1",
        "employeeName": "asdfg",
        "employeeAddress": "asdfg",
        "project": null
    }]
}

帮助将不胜感激。

Answer 1

result.listOfEntities不存在，因为result显然是一个数组：

$scope.result = [];
$scope.result.push(data);

我想如果没有数组你会更好，而是：

$scope.result = data;

甚至：

$scope.listOfEntities = data.listOfEntities;
ng-repeat="employee in listOfEntities"

Answer 2

您已将$scope.result声明为数组（$scope.result=[]）。因此result.listOfEntites无法解决任何问题。根据您的示例数据，它应该是一个对象（$scope.result={};），并且在您服务器的响应中，您应该$scope.result = data

Answer 3

为什么你使用推..我们不需要推，我们可以直接使用。

var app = angular.module('app',[]);
app.controller('AppController', [ '$scope', '$http', function($scope, $http) {
            $scope.result = [];
$scope.getEmployeeDetails = function() {            
  var data = {
    "result": true,
    "resultCode": "SUCCESS",
    "listOfEntities": [{
        "employeeId": "1",
        "projectId": "1",
        "employeeName": "asdfg",
        "employeeAddress": "asdfg",
        "project": null
    }]
  };
  $scope.result.push(data.listOfEntities[0]);
};
$scope.getEmployeeDetails();
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="app" ng-controller="AppController">
    <div class="wrapper row-offcanvas row-offcanvas-left">
        <!-- Main content -->
        <div class="program-section">
            {{result.listOfEntities}}
            <div class="container">
                <table class="table-striped">
                    <tr>
                        <th>EmployeeId</th>
                        <th>ProjectId</th>
                        <th>Employee Name</th>
                        <th>Employee Address</th>
                    </tr>
                    <tr ng-repeat="employee in result">{{employee}}
                        <td>{{employee.employeeId}}</td>
                        <td>{{employee.projectId}}</td>
                        <td>{{employee.employeeName}}</td>
                        <td>{{employee.employeeAddress}}</td>
                    </tr>
                </table>

            </div>
        </div>
        <!-- ./program-section -->
    </div>
    <!-- ./wrapper -->
</body>

在角度ng-repeat中迭代对象中存在的列表

3 个答案: