javascript - 如何将嵌套的 json 数据绑定(bind)到 angularjs 下拉列表中？

Question

我在下面有一些与时区相关的 json 数据，我需要将特定的嵌套值绑定(bind)到下拉列表中，在使用 angularjs 时，在时区数组中，它以字符串格式出现，我需要将它们绑定(bind)到下拉列表中。

时区.json --

 {
      "countries": {
     "US": {
          "id": "US",
          "name": "United States",
          "timezones": [
            "America/New_York",
            "America/Detroit",
             ]
        },
     "CA": {
          "id": "CA",
          "name": "Canada",
          "timezones": [
            "America/St_Johns",
            "America/Halifax",
           ]
        },
    "IN": {
          "id": "IN",
          "name": "India",
          "timezones": [
            "Asia/Kolkata"
          ]
        },
    }
    }

脚本--

$http({
    method: "GET",
    url: 'timezon.json'
}).then(function mySuccess(response) {
    $scope.timeZones = response.data;
}, function myError(response) {
    $scope.timeZones = response.statusText;
});

HTML 内容

 <select class="form-control">
        <option value="0">--Select Time Zones></option>
  </select>

Answer 1

您可以使用以下方法遍历您的对象键并填充您的选择。

<select class="form-control">
    <option value="0">--Select Time Zones></option>
    <option ng-repeat="(key, value) in data.countries" value="value.id">{{value.timezones.toString()}}</option>
</select>

Demo