Используем все функции в getJSON возвращает неопределенное значение

Question

Я использую метод getJSON JQuery для retrive и разобрать простой файл в формате JSON, но, когда я выходные значения на моей странице он показывает, как undefined

$.getJSON('js/example.json', function (data) { 

    var output = ''; 

    $.each(data.exercises, function (index, exercise) { 
     output += '<li>' + exercise.work.weight + ' x ' + exercise.work.reps + '</li>'; 
    }); 

    $('#example').html(output); 

}); 

example.json

{ 

    "exercises" : [ 

     { 
      "name" : "Squats", 
      "work" : [ 
       { 
        "weight" : 135, 
        "reps" : 5 
       }, 
       { 
        "weight" : 225, 
        "reps" : 5 
       }, 
       { 
        "weight" : 315, 
        "reps" : 5 
       } 
      ] 

     }, 
     { 
      "name" : "Bench", 
      "work" : [ 
       { 
        "weight" : 135, 
        "reps" : 5 
       }, 
       { 
        "weight" : 225, 
        "reps" : 5 
       }, 
       { 
        "weight" : 315, 
        "reps" : 5 
       } 
      ] 

     }, 
     { 
      "name" : "Rows", 
      "work" : [ 
       { 
        "weight" : 135, 
        "reps" : 5 
       }, 
       { 
        "weight" : 225, 
        "reps" : 5 
       }, 
       { 
        "weight" : 315, 
        "reps" : 5 
       } 
      ] 

     } 

    ] 


} 

Я думаю, что ошибка может заключаться в моей каждой функции, но я еще не смог ее идентифицировать. Есть идеи?

Answer 1

Ваше упражнение работа представляет собой массив, нужен другой цикл

$.each(data.exercises, function (index, exercise) { 
    $.each(exercise.work, function (index, work) { 
     console.log(work); 
    }); 
}); 

Answer 2

Это:

output += '<li>' + exercise.work.weight + ' x ' + exercise.work.reps + '</li>'; 

принимает ваш JSON выглядит следующим образом:

"exercises" : [ 
    { 
    "name" : "Squats", 
    "work" : 
     { 
     "weight" : 135, 
     "reps" : 5 
     } 
    }, 

Когда на самом деле work является массивом в каждом конкретном случае.

Вы хотите что-то вроде:

$.each(data.exercises, function (index, exercise) { 

    $.each(exercise.work, function(index, workout) { 
     output += '<li>' + workout.weight + ' x ' + workout.reps + '</li>'; 
    }); 

});