Javascript 根据单选按钮更新选择_Javascript_Angularjs_Json_Api

Javascript 根据单选按钮更新选择

javascript angularjs json api

Javascript 根据单选按钮更新选择,javascript,angularjs,json,api,Javascript,Angularjs,Json,Api,我已经开始学习Angularjs了。我正在学习w3schools教程，我需要尝试一些东西这里我想根据我选中的单选按钮列出下拉列表。（选择名称时，我只需要下拉列表中的名称；选择城市时，我只需要下拉列表中的城市，依此类推）如果我理解正确，对于元素，您希望根据ng model=“selection”无线电输入项中的选择有条件地显示标签。您可以使用ng options中的函数，根据传入正在迭代的项的选择以及来自无线输入的选择，为标签的属性设定目标： JS: HTML: 下面是一个使用条件标签下拉

我已经开始学习Angularjs了。我正在学习w3schools教程，我需要尝试一些东西

这里我想根据我选中的单选按钮列出下拉列表。（选择名称时，我只需要下拉列表中的名称；选择城市时，我只需要下拉列表中的城市，依此类推）

如果我理解正确，对于

元素，您希望根据

ng model=“selection”

无线电输入项中的选择有条件地显示标签。您可以使用

ng options

中的函数，根据传入正在迭代的项的选择以及来自无线输入的选择，为标签的属性设定目标：

JS:

HTML:

下面是一个使用条件标签下拉显示功能的

ng选项和as
语法
希望这有帮助
 您可以组合您的ng repeat
，并在选项上使用过滤器
html
每个ng repeat
都会使用带有选择类型字符串的筛选器。这将过滤掉所有与选择不同的选项
，非常感谢。这就是我需要的。
    <body ng-app="myApp" ng-controller="myController">
     <div>
        <input type="radio" ng-model="selection" value="Name">Name
        <input type="radio" ng-model="selection" value="Country">Country
        <input type="radio" ng-model="selection" value="City">City
        <br>
       <div ng-switch="selection">
        <div ng-switch-when="Name">
         <ul>
           <li ng-repeat="x in names">{{x.Name}}</li>
         </ul>
        </div>
        <div ng-switch-when="Country">
         <ul>
           <li ng-repeat="x in names">{{x.Country}}</li>
         </ul>
        </div>
        <div ng-switch-when="City">
         <ul>
           <li ng-repeat="x in names">{{x.City}}</li>
         </ul>
        </div>
       </div>
       <br>
      <select ng-model="selectedName" ng-options="x.Name for x in names"></select>
     </div>
    </body>

    var app = angular.module('myApp',[]);
    app.controller('myController', function($scope,$http){
      $http.get('http://www.w3schools.com/angular/customers.php')
     .then(function(response){
      $scope.names = response.data.records;
      });
    });

$scope.foo = function(x, selection) {
  switch(selection) {
    case 'Name':
      return x.Name;
      break;
    case 'City':
      return x.City;
      break;
    case 'Country':
      return x.Country;
    default:
      return x.Name;
  }
}

<select ng-model="selectedName" ng-options="x.Name as foo(x, selection) for x in names"></select>

            <select class="form-control" ng-model="selectedName">
                <option value="" selected disabled>Select Name</option>
                <option ng-repeat="n in names" value="{{n.Name}}">{{n.Name | filter:isSelection('Name')}}</option>
                <option ng-repeat="n in names" value="{{n.Country}}">{{n.Country| filter:isSelection('Country')}}</option>
                <option ng-repeat="n in names" value="{{n.City}}">{{n.City| filter:isSelection('City')}}</option>
            </select>

$scope.isSelection = function(x){
    return x == $scope.selection;
}