Angular js, on ng-change如何更新其他select控件的选项
Angular js, on ng-change how to update options of other select control
在更改年份值时,我想更改Make下拉的选项,但不知道如何更新其他控件的选项。
下面是我的柱塞形式。https://plnkr.co/edit/aV65Nab9U9I6YlK2g4sY?p=preview api.php
是服务器响应,这些选项应该显示在Make下拉菜单中,以更改年份。
autoQuoteCtrl.js
$scope.updateMakeList = function(){
}
index . html
<div class="row">
<div class="form-group">
<label class="col-sm-5 control-label" for="PC">{{questions[$state.current.name].VehicleYear.QuestionData._text}}</label>
<div class="col-sm-6">
<select ng-change="updateMakeList" custom-required="true" ng-options="answers._value as ans._promptText for ans in questions[$state.current.name].VehicleYear.QuestionData._answerOptions" ng-model="answerswers.VehicleYear" ng-required="queObj._required" class="form-control {{queObj._pageAttributes.cssclass}}" name="{{questions[$state.current.name].VehicleYear.QuestionData._attributeName}}" id="{{questions[$state.current.name].VehicleYear.QuestionData._attributeName}}" data-que-obj="questions[$state.current.name].VehicleYear.QuestionData" select-control-dir setMake custom-required></select>
</div>
</div>
<span class="form-error" ng-show="submitted && DTOstep1.VehicleYear.$error.required">This field is required.</span>
</div>
你需要把这个函数放到你的控制器中-
$scope.updateMakeList = function(name)
{
// Your logic to change value in Make dropdown
$scope.questions[name].VehicleMake.QuestionData._answerOptions = [{'_value':"test",'_promptText':"Test"}];
}
更新你的HTML(年份选择框)-
<div class="form-group">
<label class="col-sm-5 control-label" for="PC">{{questions[$state.current.name].VehicleYear.QuestionData._text}}</label>
<div class="col-sm-6">
<select ng-change="updateMakeList($state.current.name)" custom-required="true" ng-options="answers._value as ans._promptText for ans in questions[$state.current.name].VehicleYear.QuestionData._answerOptions" ng-model="answerswers.VehicleYear" ng-required="queObj._required" class="form-control {{queObj._pageAttributes.cssclass}}" name="{{questions[$state.current.name].VehicleYear.QuestionData._attributeName}}" id="{{questions[$state.current.name].VehicleYear.QuestionData._attributeName}}" data-que-obj="questions[$state.current.name].VehicleYear.QuestionData" select-control-dir setMake custom-required></select>
</div>
</div>
相关文章:
- Web应用程序,将成员状态更新为其他成员
- 如何根据其他日期的输入更新日期
- 基于其他数据结构更新 AngularJS 中的数据结构
- 如何基于其他两个滑块更新滑块
- 由其他Ember Select填充的Ember Select不更新选择绑定
- 更新其中一个字段时刷新其他输入字段.使用Angularjs(附Plunker)
- Meteor AutoForm:如何基于其他控件更新选择选项
- 如何根据其他组件中的事件更新组件URL
- Javascript错误,根据其他复选框的结果更新复选框/按钮
- Angular 2 ES6/7事件发射器更新其他组件
- 在jQuery.html()更新时,其他函数将停止工作
- 当可观察数组是其他模型的属性时,挖空不会更新 UI
- 如何使用 JavaScript 基于其他文本框更新文本框值
- Ember js - 更新其他表后,有许多关系中断
- 环回 - 基于 id 以外的其他属性的 REST 更新插入/更新
- Chrome 扩展程序会更新并重写为其他相同的扩展程序
- 在 PHP 中,当同一页面的其他实例更改时,更新页面
- 更新 Angular $interval 中的变量会导致其他函数运行
- 变量在控制台中更新.log但不在其他函数中更新
- RESTful API——处理依赖于其他更新的更新