如何从从服务器 angularjs 获取的 json 对象的选择选项字段中显示选定的值答案

【问题标题】：How to display the selected value in select option field from the json object fetched form server angularjs如何从从服务器 angularjs 获取的 json 对象的选择选项字段中显示选定的值
【发布时间】：2016-03-07 16:55:50
【问题描述】：

我获取了一个带有国家列表的json 对象。现在我想在选择选项框中显示所选国家的名称。我尝试了不同的方法，但总是显示空白值。

注意：countries 是 json object 具有键值对的国家列表。它用于在视图中显示选择选项。而tabs[0].data.country 是要选择的国家ID 的值。

我尝试过的一些代码：显示所选国家名称的代码：

在视图中显示选择选项的代码：

输出：

【问题讨论】：

显示，到目前为止你做了什么..
当然！我会用一些截图更新问题！
搜索引擎无法读取您问题中的屏幕截图代码块。志愿者不能复制粘贴您的截图代码。请编辑您的问题以用实际文本替换屏幕截图。请不要在 Stack Exchange 问题中使用屏幕截图来展示代码。

标签： javascript angularjs json

【解决方案1】：

首先将你的 json 对象转换成一个对象数组，然后你做类似的事情

    <select name="countries" id="contries" ng-model="vm.country">
      <option ng-repeat="country in vm.countries" value="{{country.id}}">{{country.name}}</option>
    </select>

只需遍历它们并从列表中选择您想要的。完整文档在这里：https://docs.angularjs.org/api/ng/directive/select

【讨论】：

感谢您的快速回复！事实上我已经做了这个。我想知道如何从列表中显示选定的值。我还查看了您提供的链接，但我对这个特定问题不太清楚。

【解决方案2】：

最后，这是解决我问题的 sn-p。

html

<div ng-controller="ExampleController">
   <form name="myForm">
     <label for="mySelect">Make a choice:</label>
     <select name="mySelect" id="mySelect"
        ng-options="option.name for option in data.availableOptions track by option.id" ng-model="data.selectedOption">
     </select>
   </form>
</div>

angular.module('defaultValueSelect', [])
  .controller('ExampleController', ['$scope', function($scope) {
    $scope.data = {
     availableOptions: [
       {id: '1', name: 'Option A'},
       {id: '2', name: 'Option B'},
       {id: '3', name: 'Option C'}
     ],
     selectedOption: {id: '3', name: 'Option C'} //This sets the default value of the select in the ui
     };
 }]);

欲了解更多信息，您可以转到此link

Also another useful tutorial here

【讨论】：