Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了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>

然后我查询REST API并获取人员数据,比如

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

题:
在AngularJS应用程序中显示页面时,如何将“(GMT -9:00)阿拉斯加”设置为所选页面

解决方法

您可以使用ng-model属性将API json响应绑定到您的选择输入.

鉴于您的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>

现在您需要控制器实际调用其余服务并获取person对象:

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,config) {
    console.log("error retriveing rest api response");
  });
}

对于这个示例,我刚刚创建了一个名为“rest_api_response.json”的文件,其中包含您的响应

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

Heres a plunker with the sample contained

大佬总结

以上是大佬教程为你收集整理的Angularjs设置选定的值全部内容,希望文章能够帮你解决Angularjs设置选定的值所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: