Как получить вложенные значения данных JSON с помощью атрибута «data-»? - PullRequest
Новая
       35

Как получить вложенные значения данных JSON с помощью атрибута «data-»?

0 голосов
/ 16 июня 2019

Я пытаюсь создать элегантный способ привязки данных json к html, используя data-attributes без необходимости написания связки пользовательского кода или использования внешней библиотеки / фреймворка.

Я могу заставить это работать нормально без вложенных данных и немного переписать свою функцию.

Проблема в том, что он читает мой data-api-value в виде строки .. поэтому я пытаюсь найти правильный способ его преобразования. Я открыт для других предложений / обходных путей, хотя.

Вот код в (codepen)

Вот глупая версия кода 

function getApiData(apiUrl, callback) {
  apiData = $.ajax({
    type: 'GET',
    url: apiUrl,
    dataType: 'json',
    success: function(json) {
      callback(json.data);
    },
    error: function(req, err) {
      console.log(err);
    },
    contentType: "application/json; charset=utf-8"
  });
}

function dataAPIrealtime() {
  const url = 'https://someapi/v1/exchange/getinstrument/bitmex/XBTUSD';
	
  getApiData(url, function(apidata){
    $('[data-api]').each(function() {
      let api = $(this).data("api");
      let value = $(this).data("apiValue");
      let data = apidata + value;

      if (data || data != data) {
        $(this).html(data);
      }
    }); 
  });
}

/* Run Functions
*********************************/
$(document).ready(function() { 
	dataAPIrealtime();
	setInterval(dataAPIrealtime, 1000); // Refresh data every 1 second
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span data-api="exchange/getinstrument" data-api-value="[instrument][symbol]"></span>
...