Угловой ng-повтор над сложным объектом

Question

У меня есть объект, содержащий 2 объекта.

Каждый из этих объектов содержит массив с 2-х объектов:

ctrl.mainArray = { 
    outsideObject_1: { 
    insideArray = [ 
     insideObject_1: { value1: 'someValue', value2: 'someOtherValue' }, 
     insideObject_2: { value1: 'someValue', value2: 'someOtherValue' } 
    ] 
    }, 
    outsideObject_2: { 
    insideArray = [ 
     insideObject_1: { value1: 'someValue', value2: 'someOtherValue' }, 
     insideObject_2: { value1: 'someValue', value2: 'someOtherValue' } 
    ] 
    }; 
}; 

Я хочу, чтобы отобразить значения insideObject_x из моего шаблона:

<ul> 
    <li ng-repeat="item in ctrl.mainArray track by item.insideArray[$index]> 
    <!-- CASE #1 --> 
    First value: {{item.insideArray[0].value1}} 

    <!-- CASE #2 --> 
    First value: {{item.insideArray[$index].value1}} 
    </li> 
</ul> 

В CASE #1 я могу напечатать первое значение , с ПЕРВОГО ОБЪЕКТА в каждом insideArray. Я хочу напечатать value1 от КАЖДОЙ insideObject_x

В CASE #2 я могу напечатать первое значение из первого объекта в только первый insideArray.

Что я делаю неправильно? Я должен печатать value1, 4 раза.

Answer 1

Я не понял, что именно вы хотите в качестве вывода, но при условии, что вы хотите напечатать значение свойства value1 на каждом объекте внутри всего insideArray s, я думаю, вы должны обрабатывать логику со стороны сценария.

HTML

<ul ng-app="myApp" ng-controller="mainController as mainCtrl"> 
    <li ng-repeat="value in mainCtrl.values track by $index"> 
    First value: {{value}} 
    </li> 
</ul> 

JavaScript (Угловое)

(() => { 
angular.module("myApp", []) 
    .controller("mainController", function() { 
     let ctrl = this; 

     ctrl.mainObj = { 
      outsideObject_1: { 
       insideArray : [ 
        { value1: 'someValue', value2: 'someOtherValue' }, 
        { value1: 'someValue', value2: 'someOtherValue' } 
       ] 
      }, 
      outsideObject_2: { 
       insideArray : [ 
        { value1: 'someValue', value2: 'someOtherValue' }, 
        { value1: 'someValue', value2: 'someOtherValue' } 
       ] 
      } 
     }; 

     ctrl.values = []; 

     for (let obj in ctrl.mainObj) { 
      for(let val of ctrl.mainObj[obj].insideArray) { 
       ctrl['values'].push(val.value1); 
      } 
     } 
}); 
})(); 

CodePen:http://codepen.io/cod3rguy/pen/ggbMKz?editors=1010

---

Если вы хотите, чтобы все значения свойств (value1, value2 и т.д.) на объектах в insideArray с, вы можете slighty изменить логику, заселяющая values массив в коде выше, как, например: -

for (let obj in ctrl.mainObj) { 
    for(let val of ctrl.mainObj[obj].insideArray) { 
     for (let v in val) { 
      ctrl['values'].push(val[v]); 
     } 
    } 
}