Для каждого LOOP через JSON.Stringify EXIF-данные изображения

Question

У меня есть изображение, где, когда я нажимаю на него, оно отображается больше с данными EXIF ​​рядом с ним. Я беру EXIF-данные с JSON.strigify, и после этого мне нужно отобразить все, что находится в этой строке, чтобы добавить ее к тегу <span> с id='makeAndModel' в моем HTML.

Я хочу сделать это для каждой функции стрелки, но я не уверен, как именно.

<code>   `<div id="imageContainer"></div>
      <div id="myModal" class="modal">
        <span class="close">&times;</span>
        <img class="modal-content" id="current">
        <pre>Make and model: <span id="makeAndModel"></span>

`<- Взяв атрибут src и создав изображения -> let $ modal = $ ('. Modal') let $ img = $ (" # imageContainer img ");$ img.click (function () {$ ('. modal-content'). attr ('src', $ (this) .attr ('src')); $ modal.css ('display', 'block') <- EXIF ​​data -> var imgCurrent = document.getElementById ('current'); EXIF.getData (imgCurrent, function () {let result = $ ('# makeAndModel') let make = JSON.stringify (EXIF. getAllTags (this));}); let $ makeAndModel = $ ('# makeAndModel'); $ makeAndModel.text (`$ {make}`)})

`

в данный момент в консоли вывод let make является объектом
let make = { "Orientation":1, "YCbCrPositioning":1, "XResolution":72, "YResolution":72, "ResolutionUnit":2, "Make":"samsung", "Model":"SM-G965F", "Software":"G965FXXU2CSB9", "DateTime":"2019:03:18 18:29:28", "ExifIFDPointer":213, "GPSInfoIFDPointer":833, "ExposureTime":0.02, "FNumber":2.4, "ExposureProgram":"Normal program" ,"ISOSpeedRatings":160, "ExifVersion":"0220", "DateTimeOriginal":"2019:03:18 18:29:28", "DateTimeDigitized":"2019:03:18 18:29:28", }

Ожидаемый вывод должен выглядеть как Make and Model : Orientation:1, YCbCrPositioning:1, XResolution:72, YResolution:72,

и т. д., как при нажатии в Свойства-> Подробная вкладка изображения

Answer 1

Примерно так может работать

let $modal = $('.modal')
let $img = $("#imageContainer img");
$img.click(function() {
  $('.modal-content').attr('src', $(this).attr('src'));
  $modal.css('display', 'block')
  var imgCurrent = document.getElementById('current');
  EXIF.getData(imgCurrent, function() {
    let result = $('#makeAndModel')
    let make = EXIF.getAllTags(this);
    let props = Object.entries(make).map(([property, value]) => {
      return `${property}: ${value}`;
    });
    result.text(props.join('\n'));
  });
})