таблица с данными json из angularjs

#html #angularjs #angularjs-ng-repeat

#HTML #angularjs #angularjs-ng-repeat

Вопрос:

У меня есть два файла json, я хочу сгенерировать динамическую таблицу, используя что-нибудь вроде angularjs / jquery. Я попробовал angularjs ng-repeat, но безуспешно.

первый JSON

 $scope.myHospital = [
  {"name":"hos1"}, 
  {"name":"hos2"},
  {"name":"hos3"},
  {"name":"hos4"},
  {"name":"hos5"}
];

Второй JSON

 $scope.data = [{
  "category":"first category",
  "procedure":[{
      "name":"pro1",
      "hospital": [
        {"price":"344"},
        {"price":"467"},
        {"price":"423"},
        {"price":"674"},
        {"price":"313"}
      ]
  }, {
    "name":"pro2",
    "hospital": [
      {"price":"234"},
      {"price":"568"},
      {"price":"136"},
      {"price":"567"},
      {"price":"666"}
    ]
  }, {
    "name":"pro3",
    "hospital": [
      {"price":"349"},
      {"price":"469"},
      {"price":"429"},
      {"price":"679"},
      {"price":"319"}
    ]
  }]
}];

И я хочу таблицу, подобную этой. Возможно ли это, тогда, пожалуйста, предоставьте мне решение, или если нет, то какие изменения требуются в моем JSON для достижения этого.Спасибо

1. $scope.myHospital и $scope.data dosent имеют общий ключ для сопоставления. Итак, как бы вы решили, какая цена должна быть для какой больницы?

2. в настоящее время я пытаюсь добиться этого для идеальной ситуации, например, каждый раз, когда у меня есть 5 больниц, и они расположены последовательно. Если это звучит не очень хорошо, я могу объединить оба JSON, как в первом JSON, я могу добавить название больницы с ценой.

3. вот такая «процедура»: [ { «name»: «pro1», «hospital»: [ {«name»: «hos1», «price»:»344″}, {«name»: «hos2», «price»:»467″}, {«name»: «hos3», «price»: «423»}, {«name»: «hos4», «price»: «674»}, {«name»: «hos5 «, «цена»: «313»} ] },

4. да, я думаю, этого хватит! можете ли вы опубликовать эти измененные данные JSON, о которых идет речь, я придумаю ответ

5. @Harshsachdev почему у вас есть $scope.data в виде массива. Можно ли пока рассматривать ее как объект? Проверьте мой ответ с этим предположением.

Ответ №1:

Для достижения этой цели вы можете иметь вложенные ng-repeat файлы. Предполагая, что цена первой больницы соответствует hos1 , вы можете сделать что-то вроде этого,

 <table>
  <tr ng-repeat="(hosIndex, hos) in myHospital">
    <td width="100px" ng-bind="hos.name"></td>
    <td width="100px" ng-repeat="pro in data[0].procedure" 
    ng-bind="pro.hospital[hosIndex].price">
    </td>
  </tr>
</table>

ДЕМОНСТРАЦИЯ

1. Спасибо @tanmay. Не могли бы вы, пожалуйста, взглянуть на эту ссылку в этом случае добавлено поле «id», потому что в некоторых случаях. Я не получаю цены для каждой больницы. Надеюсь, вы поймете проблему, пожалуйста, взгляните на размещенную ссылку «pro3».

2. Для «pro3» я хочу нулевое значение для больницы 1 и 4, потому что у них нет никакой цены.

3. @Harshsachdev можете ли вы сделать это null программно в самом JSON (запустив angular.forEach или аналогичным способом), потому что было бы довольно сложно добиться этого, просто используя ng-repeat . ИЛИ , если JSON контролируется вами, можете ли вы сохранить {"id": "1", "price": null} сам JSON?

4. на самом деле, JSON не контролируется мной, я получаю его из серверной части. но я могу изменить ее после ее получения. Итак, как я добавляю «price»: null для пустых больниц после их получения.

5. Или я могу как-то добиться этого, сопоставив идентификаторы больниц?