Angularjs设置所选的值

在html页面中，我有一个选择，如下所示

<select>  
    <option value="GMT-12:00">(GMT -12:00) Eniwetok, Kwajalein</option>  
    <option value="GMT-11:00">(GMT -11:00) Midway Island, Samoa</option>  
    <option value="GMT-10:00">(GMT -10:00) Hawaii</option>  
    <option value="GMT-9:00">(GMT -9:00) Alaska</option>  
    ...  
</select>

问题:

---

在AngularJS应用程序中显示此页面时，如何将“（GMT-9:00）Alaska”设置为所选？

您可以使用

ng model

属性将API json响应绑定到

select

输入

给定您的HTML，我们将得到这个选择下拉列表，它将绑定到

person.timezone

<div ng-controller="MainController">
    <select ng-model="person.timezone">
      <option value="GMT-12:00">(GMT -12:00) Eniwetok, Kwajalein</option>
      <option value="GMT-11:00">(GMT -11:00) Midway Island, Samoa</option>
      <option value="GMT-10:00">(GMT -10:00) Hawaii</option>
      <option value="GMT-9:00">(GMT -9:00) Alaska</option>
    </select>
  </div>

---

对于这个示例，我刚刚创建了一个名为

“rest\u api\u response.json”

的文件，其中包含您的响应

{
 "language" : "en_US",
 "timezone" : "GMT-9:00"
}

---

您的下拉列表不在

的“角度世界”

您没有绑定到它的模型，因此当您更改选择时，角度世界中不会发生任何事情

所以要么：

1.将下拉列表更改为使用模型绑定在“角度世界”中工作（然后通过将从服务器返回的值指定为所选值轻松执行所需操作）。
这是一个很好的例子

---

2.继续使用纯JS或JQuery等框架在无角度的世界中工作，并以不同的方式进行操作。

下面的问题正确吗？因为它有3张反对票，我不确定…

function MainController($scope, $http) {
  /* query rest api and retrive the person
     this of course would be replaced with the url of your actual rest call */
  $http({method: 'GET', url: 'rest_api_response.json'}).success(function(data, status, headers, config) {
    $scope.person = data;
    // dont apply if were in digest
    if(!$scope.$$phase)
        $scope.$apply();
  }).
  error(function(data, status, headers, config) {
    console.log("error retriveing rest api response");
  });
}

{
 "language" : "en_US",
 "timezone" : "GMT-9:00"
}