целевые ключи для получения данных от json

Question

Я начинаю с угловатым и пытаюсь извлечь данные из JSON. Я вызвал json-файл в службу, а затем позвонил в контроллер, который работает нормально. Теперь я хочу показать, что данные, использующие ng-repeat в моем HTML, и не смогли этого сделать, потому что я не могу понять, как настроить конкретные ключи и их ценность. Пожалуйста, проверьте мой код ниже ...

В моем JSON у меня есть две основные категории: «Телевидение» и «Стиральная машина». В каждой категории много продуктов. Я хочу сначала вызвать ng-repeat в основных категориях, а затем сделать еще один список для каждой основной категории, чтобы показать свои продукты. Я попытался назвать основные категории в html, это нормально, но теперь я хочу знать, как назвать их продукты ,

HTML так я назвал основные категории ** может быть не прав

<div ng-controller="categoryNames"> 
     <ul> 
      <li ng-repeat="(key, value) in categories[0]"> 
       {{key}} <!--Call value of each category wise --> 

      </li> 
     </ul> 
    </div> 

controller.js

myApp.service('categoryData', ['$http', function($http){ 
    return { 
    category : function(){ 
     return $http({'method' : 'GET', 'url' : 'js/product-data.json'}).then(function(response){ 
     return response.data; 
     }, function(data){ 
     console.log(data); 
     }) 
    } 
    } 

}]) 


myApp.controller('categoryNames', ['$scope', '$http', 'categoryData', function($scope, $http, categoryData){ 

    categoryData.category().then(function(data){ 
    $scope.categories = data.productCategory; 
    }) 

}]) 

JSON

{ 
    "productCategory": [{ 
     "Television": [{ 
      "brandname": "VU", 
      "image": "images/1.jpeg", 
      "detail": "Vu 102cm (40) Full HD LED TV", 
      "price": "20,000", 
      "productId": "001" 

     }, { 
      "brandname": "LG", 
      "image": "images/2.jpeg", 
      "detail": "LG 108cm (43) Full HD LED ", 
      "price": "35,978", 
      "productId": "002" 

     }, { 
      "brandname": "VU", 
      "image": "images/3.jpeg", 
      "detail": "Vu 80cm (32) HD Ready LED", 
      "price": "13,989", 
      "productId": "003" 

     }, { 
      "brandname": "BPL", 
      "image": "images/4.jpeg", 
      "detail": "BPL Vivid 80cm (32) HD Ready LED ", 
      "price": "14,989", 
      "productId": "004" 

     }, { 
      "brandname": "VU", 
      "image": "images/5.jpeg", 
      "detail": "Vu 80cm (32) HD Ready Smart LED ", 
      "price": "17,989", 
      "productId": "005" 

     }], 
     "Washing Machines": [{ 
      "brandname": "BPL", 
      "image": "images/wash1.jpeg", 
      "detail": "BPL Vivid 80cm (32) HD Ready LED ", 
      "price": "14,989", 
      "productId": "004" 
     }, { 
      "brandname": "Samsung", 
      "image": "images/wash2.jpeg", 
      "detail": "BPL Vivid 80cm (32) HD Ready LED ", 
      "price": "12,989", 
      "productId": "004" 
     }, { 
      "brandname": "Whirlpool", 
      "image": "images/wash3.jpeg", 
      "detail": "BPL Vivid 80cm (32) HD Ready LED ", 
      "price": "15,989", 
      "productId": "004" 
     }] 
    }] 
} 

Answer 1

Редакция: вы возвращаете объект, который содержит массив вы можете перебирать бросить

ng-repeat="product in categories" 

внутри этого iteraion

ng-repeat="tel in product.Television" 

Answer 2

Уплотненных нг-повтор необходим, приведенный ниже пример

<div ng-controller="categoryNames"> 
    <ul> 
     <li ng-repeat="(key, value) in categories[0]"> 
      {{key}} - <span ng-repeat="(subkey, subval) in value">{{subkey}} : {{subval}}, </span> 

     </li> 
    </ul> 
</div> 

вы может даже использовать другую версию ng-repeat для внутреннего ng-repeat в приведенном выше коде, например,

<div ng-controller="categoryNames"> 
     <ul> 
      <li ng-repeat="(key, value) in categories[0]"> 
       {{key}} <br/> 
       <div ng-repeat="obj in value"> 
        <label>Brand Name:</label><label>{{obj.brandname}}</label> 
        <img src={{obj.image}}/> 
        <!-- similarly you can do for rest of it's properties--> 
       </div> 
      </li> 
     </ul> 
    </div> 

Answer 3

Кажется, что вы хотите получить имена productCategories. Как ваши ProductCategories-имена идентификатор самого JSon-Массивы вы должны получить ключи от использования Object.keys (категории)

<li ng-repeat="key in Object.keys(categories)"> 
    {{key}} <!--Call value of each category wise --> 
</li> 

Если после этого вы хотите, чтобы вернуть все продукты, которые вы можете использовать второй нг-повторение по категориям [клавиша]

<li ng-repeat="product in categories[key]"> 
    {{product.name}} 
</li>