Как получить доступ к данным Nested JSON?

Question

У меня возникли проблемы с отображением Nested JSON с ng-repeat. У меня есть список автомобилей, назначенных человеку за определенный месяц. Если вы будете искать апрель, вы получите данные за апрель. Нажмите на имя, и оно должно заполнить раздел «Автомобиль». Вот pluker. У меня есть две функции: одна для кнопки поиска, а другая для выбора строки. Может ли кто-нибудь сказать мне правильный способ подтолкнуть информацию о вложенном автомобиле? Информация о машине находится в результатах.

$scope.results = []; 
    $scope.clickButton = function (enteredValue) { 

    $scope.items = $scope.info; 


    angular.forEach($scope.items[enteredValue], function (item, key) { 
     $scope.results.push({ 
       name: item.Name, 
       address: item.Address, 
       phone: item.Phone, 
       status: item.Status, 
       cars:item.Cars 
      }); 
    }); 
    }; 

    $scope.cars = []; 

    $scope.clickButton2 = function() { 

    $scope.rowItems = $scope.info.Cars; 

    angular.forEach($scope.rowItems, function(car, key){ 
     $scope.cars.push({ 

      vehicleMake: car.Make, 
       vehicleYear: car.Year 
     }); 
     }); 
}; 

Answer 1

Самый простой способ реализовать это за счет использования переменной $index области действия, установленный ngRepeat (см the docs). Это позволяет передать индекс элемента результата к методу контроллера, так что он знает, какой результат читать автомобили из:

<tr ng-repeat="result in results"> 
    <td ng-click='showCars($index)'>{{result.name}}</td> 
    <td>{{result.address}}</td> 
    <td>{{result.phone}}</td> 
    <td>{{result.status}}</td> 
</tr> 

Вы можете использовать индекс, как это:

$scope.showCars = function(resultIndex) { 
    $scope.cars = $scope.results[resultIndex].cars; 
} 

И наконец, отображать $scope.cars на странице:

<table> 
    <tr> 
    <th>Car</th> 
    <th>Year</th> 
    </tr> 
    <tr ng-repeat="car in cars"> 
    <td>{{Make}}</td> 
    <td>{{Year}}</td> 
    </tr> 
</table> 

---

еще одно: для массива transformat ионах, таких как нижний корпус атрибута в вашем примере кода, рассмотрите возможность использования Array map() method вместо angular.forEach(). Вот пример:

$scope.cars = $scope.results[resultIndex].cars.map(function(car) { 
    return { 
    make: car.Make, 
    year: car.Year 
    }; 
};