Как отобразить значения переменных переменных json в ng-repeat?

0

Я следую за JSON:

[
   {
      "item0":"red",
      "item1":"green"},
   {
      "item0":"blue",
      "item1":"black",
      "item2":"purple"
   }
   {
      "item0":"yellow"
   }
]

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

<div ng-repeat="upsell in upsellData">       
  <div class="style-select prefilled">
    <div class="col-sm-3">
         <input type="text" class="form-control" readonly value="{{upsell.item0}}">
     </div>
    <div class="col-sm-3">
         <input type="text" class="form-control" readonly value="{{upsell.item1}}">
     </div>
  </div>
</div>

Это просто дублирует 0-й элемент, 1-й элемент, 2-й элемент и т.д., Но мои значения ключей могут варьироваться в зависимости от данных.

Может кто-то, пожалуйста, помогите мне в получении значений для переменного количества ключей через ng-repeat?

Я также пробовал с $index и вложенным ng-repeat, но не получил желаемого результата.

Заранее спасибо за вашу помощь.

3 ответа

3

Вы можете сделать что-то вроде этого:

<div ng-repeat="upsell in upsellData">       
  <div class="style-select prefilled">
    <div class="col-sm-3" ng-repeat="(key, value) in upsell">
      <input type="text" class="form-control" readonly value="{{ value }}">
    </div>
  </div>
</div>

В противном случае, я бы рассмотрел возможность перераспределения данных перед их повторением.

  • 0
    Спасибо! Вы спасли мой день :) Можете ли вы сказать мне, как вы хотите изменить порядок данных?
  • 0
    @ RituG.Vijaywargiya Вы можете перебирать данные, анализировать ключи и изменять их в соответствии с вашими потребностями. Дело в том, что вы делаете это в своей бизнес-логике, а не в своих взглядах. Я предложил это, потому что не был уверен, достаточно ли в вашем случае итерации по парам ключ / значение.
0

Вы можете использовать nested-repeat [ng-repeat в ng-repeat] как (ключ, val):

<div ng-repeat="upsell in upsellData">       
  <div class="style-select prefilled">
    <div class="col-sm-3" ng-repeat="(key, val) in upsell">
      <input type="text" class="form-control" readonly value="{{val}}">
    </div>
  </div>
</div>
0

используйте вложенные ng-повторы, используя (ключ, значение) во внутреннем ng-повторе

<div ng-repeat="upsell in upsellData">       
  <div class="style-select prefilled">
    <div class="col-sm-3" ng-repeat="(key,value) in upsell">
         <input type="text" class="form-control" readonly value="{{value}}">
     </div>
  </div>
</div>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню