用 json 填充下拉列表（SyntaxError: Unexpected token

Question

我试图用styleName我的 JSON 数据文件中的字段值简单地填充一个下拉列表。例如，我的 json 数据如下所示：{"name":{"styleName":"name","fillType":"none","fillTrans":"0","outlineType":"solid","outlineWidth":"1","outlineColor":"#ff0000"}}  {"sarah":{"styleName":"sarah","fillTrans":"none","fillTrans":"0","outlineType":"solid","outlineWidth":"1","outlineColor":"#ff0000"}}//....下面是我的 JS。let dropdown = document.getElementById('tem');dropdown.length = 0;let defaultOption = document.createElement('option');defaultOption.text = 'Choose Template';dropdown.add(defaultOption);dropdown.selectedIndex = 0;const urld = '../../templates.json';fetch(urld)    .then(      function(response) {        if (response.status !== 200) {          console.warn('Looks like there was a problem. Status Code: ' +           response.status);          return;        }      // Examine the text in the response      response.json().then(function(data) {          let option;        console.log(data);        for (let i = 0; i < data.length; i++) {          option = document.createElement('option');          option.text = data[i].styleName;          //option.value = data[i].abbreviation;          dropdown.add(option);        }          });      }    )    .catch(function(err) {      console.error('Fetch Error -', err);    });尽管有响应，但我不断收到此错误200，下拉列表仍然为空白.. 错误：Uncaught (in promise) SyntaxError: Unexpected token { in JSON at position xxxPromise.then (async)(anonymous) @ VM8493:22Promise.then (async)(anonymous) @ VM8493:13下拉标记就是这样：                    <select id="tem" class='w150'>                    </select>

Answer 1

 replace this option.text = data[i].styleName;

let keys=Object.keys(data[i])

    with option.text = data[i][keys[0]].styleName