AngularJS中的ng-repeat没有正确绑定

I am trying to render a html table with a list populated from my controller. This is what I am doing:

我试图渲染一个html表，其中包含从我的控制器填充的列表。这就是我在做的事情：

//Home Controller
app.controller("HomeController", function ($scope, $location, ExamService, AuthenticationService, $cookieStore) {

  $scope.items = '[{"id":"1","title":"Test 1","description":"this is a description"}]';


});

and in the page:

并在页面中：

 <table class="table" ng-controller="HomeController">
                        <th>Id</th>
                        <th>Title</th>
                        <th>Description</th>
                        <tr ng-repeat="item in items">
                            <td>{{item.id}}</td>
                            <td>{{item.title}}</td>
                            <td>{{item.description}}</td>
                         </tr>
    </table>

However this generates as a blank table with 109 tr nodes...what I am doing wrong? please help

然而，这会生成一个包含109个tr节点的空白表...我做错了什么？请帮忙

1 个解决方案

#1

The problem is $scope.items is a string literal.

问题是$ scope.items是一个字符串文字。

Instead, use an array literal:

相反，使用数组文字：

 $scope.items = [{"id":"1","title":"Test 1","description":"this is a description"}];

Or shorter:

或更短：

 $scope.items = [{id: 1,"title":"Test 1",description:"this is a description"}];

( fiddle )

（小提琴）

Why does this confusion happen?

为什么会出现这种混乱？

In my opinion this happens because people often confuse JSON - the data exchange format (which in JS you store in strings)and JavaScript object literals. [] is for an array object literal both in the JS language and with the JSON data exchange format. See What are the differences between JSON and JavaScript object?

在我看来，这是因为人们常常混淆JSON - 数据交换格式（在JS中存储在字符串中）和JavaScript对象文字。 []用于JS语言和JSON数据交换格式的数组对象文字。请参阅JSON和JavaScript对象之间的区别是什么？

#1