javascript - 无法获取AngularJS中下拉菜单的值

Question

我有一个下拉选择菜单，我想将所选值存储在 Controller 中。即，如果选择了 office1，则选择 Office!是在范围内选择的等等。我无法将值存储在 Controller 中，因为我是 angularjs 的新手。有人可以帮忙吗这是我的下拉代码

    <div class="col-xs-12">
<h5>Select the System:</h5>

   <select id="repeatSystem" ng-model="selectedSystem" style="width: 100%">
    <option ng-repeat="(key,value) in systems" value="{{key}}">{{key}}</option>
</select>

 <select id="repeatOffice" ng-model="selectedState" style="width: 100%">
    <option ng-repeat="system in systems[selectedSystem]" value="state">{{system}}</option>
</select>

</div>

这是插件链接 http://plnkr.co/edit/nNsM4VMVeHXS2hDIsAAd?p=preview

Answer 1

因为您将选择下拉列表与 ng-model 绑定(bind)，所以您可以简单地在 Controller 中访问这些值。

这将为您提供第一个下拉选择的值

$scope.selectedSystem //same in view {{selectedSystem}}

这是第二个

$scope.selectedState //same in view {{selectedState}}

DEMO选择值并检查。

<小时/>

更新

我更新了以下行，其中您将 value="state" 硬编码为我将其更改为 value="{{state}}":

<option ng-repeat="state in result[selectedArea]" value="{{state}}">{{state}}</option>

查看更新的DEMO