Извлечение данных из localStorage и отображение их в таблице

Question

Я пытаюсь получить данные из localStorage и показать все записи в таблице, но не могу получить доступ к ключу.

Последняя console.log показывает конкретную запись.myFunction() console.log показывает все записи, но когда я пытаюсь return все записи, я получаю Cannot read property 'KlientoNr' ошибку.Во втором <td> я пытаюсь получить доступ к записям напрямую, но я получаю undifiend.Как правильно показать все записи в таблице?

jQuery(document).ready(function($) {
  const clients = JSON.parse(localStorage.getItem("data"));
  const odontologas = clients.Odontologas;

  const myFunction = () => {
    const arrayLength = odontologas.length;
    for (var i = 0; i < arrayLength; i++) {
      console.log(odontologas[i].KlientoNr);
    }
    return odontologas[i].KlientoNr;
  };

  $.each(odontologas, function() {
    $("#odontologas").append(`<tr>
      <td>${myFunction()}</td>
      <td>${odontologas.EilėsNr}</td>
      <td>
        <button type="submit" class="btn btn-success">
          Aptarnautas
        </button>
      </td>
    </tr>`);
  });
  console.log(odontologas[7].KlientoNr);
});

Answer 1

В вашем коде есть несколько проблем.Например, myFunction запускает цикл for от i = 0 до длины массива.Если массив имеет, скажем, 8 элементов.Тогда, когда мне станет 8, тогда только цикл разорвется.И после цикла for вы возвращаете odontologas [i] .KlientoNr;Но мне 8 лет, и в этом индексе нет пункта.Таким образом, он возвращает неопределенное значение.

Вторая проблема в части HTML, которую вы написали odontologas.EilėsNr.odontologas это массив.Здесь нет индекса.Так что это также вернет undefined.

Answer 2

Проблема с ${odontologas.EilėsNr} в том, что odontologas - это весь массив, у которого нет свойства EilėsNr

. Используйте аргументы, передаваемые каждому обратному вызову, для доступа к конкретному экземпляру объекта

 $.each(odontologas, function(i, item) {
    $("#odontologas").append(`<tr>
      ...
      <td>${item.EilėsNr}</td>
      // OR
      <td>${odontologas[i].EilėsNr}</td>
      ...