Question

我是AngularJS的新手，现在正在努力学习它。这次我正在学习如何使用codeigniter创建一个页面应用程序，并使用RESTful lib创建角度。

我有这样的JSON：

[{"id":"25","title":"abc","description":"sss"},{"id":"26","title":"sd","description":"sdsd"}]

无论我做什么，我都无法将$scope工作ng-repeat。这是我的功能：

$http.get('Api/items').then(function(response)
        {       
            $scope.items = response;
            console.log(response);
        });

这是我的表格视图：

<table class="table table-bordered pagin-table">
<thead>
    <tr>
        <th>No</th>
        <th>Title</th>
        <th>Description</th>
        <th width="220px">Action</th>
    </tr>
</thead>
<tbody>
    <tr ng-repeat="x in items">
        <td>{{ $index + 1 }}</td>
        <td>{{ x.title }}</td>
        <td>{{ x.description }}</td>
        <td>
            <button data-toggle="modal" ng-click="edit(x.id)" data-target="#edit-data" class="btn btn-primary">Edit</button>
            <button ng-click="remove(x,$index)" class="btn btn-danger">Delete</button>
        </td>
    </tr>
</tbody>

当这些全部执行时会发生这种情况：

根本没有$ scope获取的数组。奇怪的是<tr>重复了5次而没有任何价值。但是当我调用array [0]时，$ scope可以获取它：

<table class="table table-bordered pagin-table">
<thead>
    <tr>
        <th>No</th>
        <th>Title</th>
        <th>Description</th>
        <th width="220px">Action</th>
    </tr>
</thead>
<tbody>
    <tr ng-repeat="x in items">
        <td>{{ $index + 1 }}</td>
        <td>{{ x[0].title }}</td>
        <td>{{ x[0].description }}</td>
        <td>
            <button data-toggle="modal" ng-click="edit(x.id)" data-target="#edit-data" class="btn btn-primary">Edit</button>
            <button ng-click="remove(x,$index)" class="btn btn-danger">Delete</button>
        </td>
    </tr>
</tbody>

我哪里出错？有人能帮助我吗？

Answer 1

这是因为promise从服务器返回原始HTTP响应而不是解析结果数据。你应该试试这个：

$http.get('Api/items').then(function(response)
        {       
            $scope.items = response.data;
            console.log(response);
        });

Answer 2

@digit已经在你的$ hhtp调用中指出了这个问题。现在对于这个JSON：

 [{"id":"25","title":"abc","description":"sss"},{"id":"26","title":"sd","description":"sdsd"}]

。无需在ng-repeat中给出索引号。 //{{ x[0].title }}

<tr ng-repeat="x in items">
        <td>{{ $index + 1 }}</td>
        <td>{{ x.title }}</td>
        <td>{{ x.description }}</td>
        <td>
            <button data-toggle="modal" ng-click="edit(x.id)" data-target="#edit-data" class="btn btn-primary">Edit</button>
            <button ng-click="remove(x,$index)" class="btn btn-danger">Delete</button>
        </td>
    </tr>

需要帮助获取数据JSON到范围AngularJS

2 个答案: