Question

我有这些数据：

{
   "order":[
      {
         "id":1,
         "table":1,
         "foods":"{'foods':[{'id':2, 'name':'Nasi Minyak', 'qty':1}]}",
         "drinks":"{'drinks':[{'id':1,'name':'Teh O Ais','qty':1}]}",
         "waiter":"ali",
         "foods_status":0,
         "drinks_status":0,
         "created_at":"2015-07-12T00:30:52.637Z",
         "updated_at":"2015-07-12T00:30:52.637Z"
      },
      {
         "id":2,
         "table":2,
         "foods":"{'foods':[{'id':2, 'name':'Nasi Goreng', 'qty':1}]}",
         "drinks":"{'drinks':[{'id':1,'name':'Milo Ais','qty':1}]}",
         "waiter":"abu",
         "foods_status":0,
         "drinks_status":0,
         "created_at":"2015-07-12T00:51:43.552Z",
         "updated_at":"2015-07-12T00:51:43.552Z"
      }
   ]
}

我试着抓住桌子里面的所有食物name：

<table class="table-bordered table table-striped">
        <thead>
            <tr>
                <td>#</td>
                <td>Name</td>
                <td>Action</td>
            </tr>   
        </thead>
        <tbody>
            <tr ng-repeat="order in orders">
                <td>{{order.id}}</td>
                <td>{{order.foods.name}}</td>
                <td>
                    <button class="btn btn-danger" ng-click="">Delete</button>
                </td>
            </tr>
        </tbody>
    </table>

这是我的$http.get获取数据：

$http.get("../api/orders")
 .success(function(data) {
  var order = data.order;
  $scope.orders = order;
 });

我设法绑定id，但我无法绑定name数组中的foods。如何获取此数据的食物数组中的name？

Plunker ： http://plnkr.co/edit/2oiOc06cZph4en8DJ18n

Answer 1

你需要另一个ng-reapeat。像这样：

<tr ng-repeat="order in orders">
    <td>{{order.id}}</td>
    <td>
        <span ng-repeat="item in order.foods.foods">{{item.name}}/</span>
    </td>
    <td>
        <button class="btn btn-danger" ng-click="">Delete</button>
    </td>
</tr>

另一个考虑因素是关于JSON的格式。这一行：

"foods":"{'foods':[{'id':2, 'name':'Nasi Minyak', 'qty':1}]}"

它的方式，＆＃34;食物＆＃34;持有String，而不是Object。要使ng-reapeat工作，您需要使用

从字符串强制JSON

JSON.parse(jsonString);

或将您的JSON更改为：

"foods":{"foods":[{"id":2, "name":"Nasi Minyak", "qty":1}]}

旁注，为什么要重复按键＆＃34;食物＆＃34;和＆＃34;饮料＆＃34;？对我来说似乎不合逻辑。将您的数据结构更改为：

"order":[
      {
         "id":1,
         "table":1,
         "foods":[{"id":1, "name":"Nasi Kerabu", "qty":1},{"id":2, "name":"Nasi Minyak", "qty":1}],
         "drinks":[{"id":1,"name":"Sirap Ais","qty":1},{"id":2, "name":"Milo Ais", "qty":1}],
         "waiter":"ali",
         "foods_status":0,
         "drinks_status":0,
         "created_at":"2015-07-12T00:30:52.637Z",
         "updated_at":"2015-07-12T03:30:35.684Z"
      },
      ...
      ]

并使用：

<td>  <span ng-repeat="item in order.foods">{{item.name}}</span> </td>

这是一个有这些修改的plunker： http://plnkr.co/edit/UVvCVzh4hbsEwolyWpDs?p=preview

Answer 2

每个order都是这样的对象：

  {
     "id":2,
     "table":2,
     "foods":"{'foods':[{'id':2, 'name':'Nasi Goreng', 'qty':1}]}",
     "drinks":"{'drinks':[{'id':1,'name':'Milo Ais','qty':1}]}",
     "waiter":"abu",
     "foods_status":0,
     "drinks_status":0,
     "created_at":"2015-07-12T00:51:43.552Z",
     "updated_at":"2015-07-12T00:51:43.552Z"
  }

请注意foods指向一个对象，其唯一的键'foods'指向一个数组......其第一个组件应该是一个对象。但是，如果你仔细阅读：

"foods":"{'foods':[{'id':2, 'name':'Nasi Goreng', 'qty':1}]}",

请注意围绕foods值的双引号？它们意味着它指向一个String而不是一个对象。

首先，您需要删除围绕foods和drinks值的双引号：

"foods":{'foods':[{'id':2, 'name':'Nasi Goreng', 'qty':1}]},
"drinks":{'drinks':[{'id':1,'name':'Milo Ais','qty':1}]},

然后将所有单引号替换为double，以使对象符合JSON对象定义：

"foods":{"foods":[{"id":2, "name":"Nasi Goreng", "qty":1}]},
"drinks":{"drinks":[{"id":1,"name":"Milo Ais","qty":1}]},

现在，要获得'name'，您需要访问order.foods.foods[0].name而不是order.foods.name。

Answer 3

这是一个有效http://plnkr.co/edit/snE9Em0tCKh0nUHIlTFn?p=preview的掠夺者。考虑修改您的JSON文件。使用双引号而不是单引号。

在新修补程序中修改后的JSON文件中删除双引号"[{'id':1,

Answer 4

我对您的数据进行了一些更改，并解决了您遇到的问题。

这是plunker链接

`http://plnkr.co/edit/nxBGMMyuNIzUOvQAu7YY?p=preview`

如何在对象中重复对象的数组？

4 个答案: