Как сделать динамический ввод флажка из сформированной базы данных JSON - PullRequest
Новая
       29

Как сделать динамический ввод флажка из сформированной базы данных JSON

0 голосов
/ 02 октября 2019

Может кто-нибудь помочь мне, как сделать динамический флажок?

Итак, у меня есть данные JSON, подобные этим 

 [ {
  "categoryName" : "Category 1",
  "items" : [ {
    "value" : "value1",
    "label" : "label1"
  }, {
    "value" : "value2",
    "label" : "label2"
  } ]
}, {
  "categoryName" : "Category 2",
  "items" : [ {
    "value" : "value3",
    "label" : "label3"
  } ]
} ]

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

результат должен быть примерно таким: ЭТА КАРТИНА

PS: извинитеза мой плохой английский

1 Ответ

0 голосов
/ 02 октября 2019 
  const array = [ {
  "categoryName" : "Category 1",
  "items" : [ {
    "value" : "value1",
    "label" : "label1"
  }, {
    "value" : "value2",
    "label" : "label2"
  } ]
}, {
  "categoryName" : "Category 2",
  "items" : [ {
    "value" : "value3",
    "label" : "label3"
  } ]
} ]

let category = "";
let checkboxes = "";

array.forEach(el => {
category += `<h3>${el.categoryName}</h3>
`;
 if (el.items.length > 0) {
 el.items.forEach(v => {
 checkboxes += `<input type ="checkbox" value="${v.value}"> <label for 
 ="${v.value}">${v.label}</label>`;
  });
 } else {
checkboxes = ``;
}
});

Не проверено, но я надеюсь, что это даст вам ключ к решению вашей проблемы.

...