下拉取决于其他下拉 - angularjs [英] Dropdown depends on other dropdown - angularjs

问题描述

我有以下

   var servers =   [
           {
               "name": "server1",
               "version":
               [
                   "10.x"
               ]
           },
           {
               "name": "server2",
               "version":
               [
                   "1", "2"
               ]
           }
       ]

我想有两个下拉。
第一个下拉列表会显示名。
当用户从第一个下拉选择名称，第二个下拉应相应进行填充的版本。

I want to have two drop down. First dropdown will display "name". When user selects name from the first dropdown, second dropdown should be populated with corresponding "version".

非工作的jsfiddle链接： http://jsfiddle.net/fynVy/174/

Non-working jsfiddle link: http://jsfiddle.net/fynVy/174/

推荐答案

您需要调整您的HTML模板，使第一个下拉显示的是服务器的名称，而对于第二个下拉选项下所依据的版本选择的下拉（第一个下拉的ngModel）。

You need to tweak your HTML template, so that the first drop down is displaying the server name, and that the options for the 2nd drop down are based upon the versions in the selected drop down (ngModel of the first drop down).

<div ng-controller="MyCntrl">
    <select ng-model="server" ng-options="x.name for x in servers"></select>
    <select ng-model="version" ng-options="val for val in server.version"></select>
</div>

这里

工作拨弄

working fiddle here

这篇关于下拉取决于其他下拉 - angularjs的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！