如何在AngularJs中访问嵌套的Json对象

时间:2015-02-20 14:25:33

标签: javascript php json angularjs

我使用AngularJs / Laravel应用程序。我尝试在每个 facture 中访问。实际上我无法打印出整个制作对象,但我想知道如何访问这些项目以便我可以循环通过它们并显示每个项目。

这是我发送Json数据的Php控制器

public function show($id)
{
    $facture = Facture::where('id', '=', $id)->with('items')->get();
    return Response::json($facture);
}

这是我简化的AngularJs控制器

$http.get('api/factures/' + $stateParams.factureId).success(function(data) {
  $scope.facture = data;
});

实际上

{{facture |json}}
打印出来:

[
  {
    "id": 10200,
    "client_id": 1,
    "lead_id": 1,
    "courtedescription": "Description test",
    "etat": "En attente",
    "created_at": "2014-12-30 10:01:46",
    "updated_at": "2014-12-30 10:01:46",
    "items": [
      {
        "id": 1,
        "facture_id": 10200,
        "description": "Item numéro 1",
        "prix": "15.00",
        "tps": "0.75",
        "tvq": "1.50",
        "grandtotal": "17.25",
        "created_at": "2014-12-30 10:01:46",
        "updated_at": "2014-12-30 10:01:46"
      },
      {
        "id": 2,
        "facture_id": 10200,
        "description": "Deuxième item quoi",
        "prix": "135.00",
        "tps": "6.75",
        "tvq": "13.47",
        "grandtotal": "155.22",
        "created_at": "2014-12-30 10:01:46",
        "updated_at": "2014-12-30 10:01:46"
      }
    ]
  }
]

这是一个简化的Plunkr,专注于基本要素:http://plnkr.co/edit/fZmb4fAX0GJCDH2cpxwQ?p=preview

我怎样才能访问这些项目?

1 个答案:

答案 0 :(得分:1)

您可以将fucture值用作普通数组,因为它在视图范围内。

例如,如果你想要数组中第一个对象的id,你将使用以下

{{facture[0].id |json}}

如果您想循环显示每个值,请查看https://docs.angularjs.org/api/ng/directive/ngRepeat

希望这有帮助!