Question

我正在尝试访问此对象中的人工项目。但是，我似乎无法使用正确的ng-repeat来获取它们。这是我正在使用的对象：

"widget": {
"info": {
  "address1": "123 Main St",
  "address2": "Suite B",
  "address3": "Lewis Center, OH 90210",
  "image": "https://c2a75498abd84ce981ec-a2ffba3ae148d04ae1bf99da610613f0.ssl.cf5.rackcdn.com/7262989f-6400-4bf9-a360-d0eb980b/properties/9c6dbebb-1b25-4a3d-9797-59072799/img/img_SpifOfl7mRj28LE.jpg",
  "water_meter": null,
  "gas_meter": null,
  "electric_meter": null,
  "inspection_notes": null,
  "owner_present": false,
  "renter_present": false,
  "date_due": "2017-02-02 01:15:00"
},
"lineItems": [
  {
    "area": "Bedroom",
    "label": "Sleep Time",
    "notes": "",
    "pictures": [],
    "subLineItems": [
      {
        "label": "Flooring",
        "data": {
          "rates": [
            {
              "label": "Damaged",
              "value": "1",
              "color": "damaged-red"
            },
            {
              "label": "Poor",
              "value": "2",
              "color": "poor-orange"
            },
            {
              "label": "Dirty",
              "value": "3",
              "color": "dirty-yellow"
            },
            {
              "label": "Fair",
              "value": "4",
              "color": "fair-light-blue"
            },
            {
              "label": "Good",
              "value": "5",
              "color": "good-green"
            }
          ]
        },
        "items": [
          [
            {
              "uuid": "6f5fed0c-db03-41a0-a575-15af3ad3",
              "label": "Hot Water Tank",
              "selected": false,
              "price": 500,
              "labor": [
                {
                  "uuid": "8b9f9ea2-b163-45c0-9a80-087a8e16",
                  "label": "Install Carpet Basic",
                  "selected": false,
                  "price": "1.00"
                },
                {
                  "uuid": "a696faca-197a-4fd9-972c-05f197f4",
                  "label": "Install Trim Basic",
                  "selected": false,
                  "price": "0.50"
                },
                {
                  "uuid": null,
                  "label": "Select",
                  "selected": true
                }
              ]
            }

我可以访问劳动项目正上方的物料项目（即：热水箱），但似乎无法更深入到劳动力本身（即：安装地毯基础）。它只显示为空白/未定义。这是我的HTML：

<li ng-repeat="item in subLineItem.items track by $index" class="bouncy-slide-left" ng-class-even="'even-stripe'">
     <!-- MATERIALS -->
     <div class="form-group col-xs-3" style="margin-left: 0px !important">
        <label for="material">{{labels.material.label}}</label>
        <br>
       <select name="material" class="form-control" ng-model="expense.mat.item" style="width: 125px">
          <option value="{{mat.uuid}}" ng-repeat="mat in item" ng-selected="mat.selected">{{mat.label}}</option>
       </select>
   </div>
   <div class="form-group col-xs-2">
       <label>{{labels.material_qty.label}}</label>
       <br>
       <input type="text"  ng-model="item.mat.qty" class="form-control" name="quantity" placeholder="{{labels.material_qty.placeholder}}" style="width: 55px; overflow: scroll">
   </div>
   <div class="form-group col-xs-2">
       <label>{{labels.material_cost.label}}</label>
       <br>
       <input type="text" ng-model="expense.mat.price" class="form-control" name="labor"  placeholder="{{labels.labor_cost.placeholder}}" style="width: 55px; overflow: scroll">
   </div>
   <div class="form-group col-xs-2">
       <label>{{labels.totals.total}}</label>
       <br>
       <input type="text" ng-model="expense.mat.total" class="form-control" name="labor" placeholder="{{labels.labor_cost.placeholder}}" style="width: 55px; overflow: scroll">
  </div>
  <div class="icon-str col-xs-1" style="padding-left: 0px" ng-click="removeItem($parent.$parent.$index, $parent.$index, $index)">
       <label for=""></label>
       <br>
       <i class="fa-trash delete-inspec"></i>
   </div> 
 <!-- LABOR  ITEMS -->
   <div class="form-group col-xs-3">
       <label for="labor">{{labels.labor.label}}</label>
       <br>
       <select name="labor" class="form-control" ng-model="item.lab.item" style="width: 125px">
            <option value="{{lab.uuid}}" ng-repeat="lab in item.labor" ng-selected="lab.selected">{{lab.label}}</option>
       </select>
    </div>
    <div class="form-group col-xs-2">
    <label>{{labels.material_qty.label}}</label>
    <br>
    <input type="text" ng-model="item.lab.qty" class="form-control" name="hours" placeholder="{{labels.labor_qty.placeholder}}" style="width: 55px;overflow: scroll">
</div>
<div class="form-group col-xs-2">
     <label>{{labels.labor_cost.label}}</label>
     <br>
     <input type="text" ng-model="item.lab.price" class="form-control" name="labor" placeholder="{{labels.labor_cost.placeholder}}" style="width: 55px;overflow: scroll"></div>

正如您所看到的，我尝试使用“lab in item.labor”来访问该数组，但它不起作用。此外，如果有人有更好的想法嵌套这些数据，让我的生活更轻松请让我知道。让这么多数据深入嵌套是非常令人困惑的。任何建议都会很棒。谢谢！

Answer 1

根据你的json subLineItems.items是一个数组数组。所以item.labor将是未定义的。

您可以尝试lab in item[0].labor。您还必须更改使用item的其他位置。如果subLineItems.items可以包含多个项目，那么您可能需要考虑每个项目。

如何使用ng-repeat重复这些人工项目？

1 个答案: