Angularjs 根据 一个select的值去设置另一个select的值
发布时间:2020-12-17 09:24:02 所属栏目:安全 来源:网络整理
导读:html: div ng-controller="mySelectController"select ng-model="myField" ng-options="Field.label for Field in names" ng-change="mySelectControllerChange()"option value=''{{'SELECT.LABEL.VXI.CUSTOM.SELECT' | translate}}/option/select/div div ng
html:
<div ng-controller="mySelectController"> <select ng-model="myField" ng-options="Field.label for Field in names" ng-change="mySelectControllerChange()"> <option value=''>{{'SELECT.LABEL.VXI.CUSTOM.SELECT' | translate}}</option> </select> </div> <div ng-controller="myRelationController"> <select ng-model="myRelation" ng-options="relation.name for relation in relationList" > <option value=''>{{'SELECT.LABEL.VXI.CUSTOM.SELECT' | translate}}</option> </select> </div> js: var mySelectController=['$scope','$http','$rootScope',function($scope,$http,$rootScope) { //$http的method可以是get/delete/head/jsonp/post/put //$http服务快捷的get请求 //alert('root=='+ACTIVITI.CONFIG.contextRoot);//对应/activiti-explorer/service $http({ method:'PUT',url:ACTIVITI.CONFIG.contextRoot +'/getFormFieldList' }) .success( function(data,status,headers,config){ //成功加载 $scope.names=data; }) .error( function(data,config){ //处理错误 //do nothing } ); //change $scope.mySelectControllerChange=function(){ var app=angular.module('activitiModeler',[]); if($scope.myField.optionGroupId!=null && $scope.myField.optionGroupId!=''){ //有optionGroup console.log('if'); $rootScope.relationList = [{id:0,name:'等于'},{id:1,name:'不等于'},{id:2,name:'包含'}]; }else{ //没有optionGroup console.log('else'); $rootScope.relationList = [{id:0,{id:3,name:'大于'},{id:4,name:'小于'},{id:5,name:'小于等于'},{id:6,name:'大于等于'},name:'包含'}]; } } } ]; //AngularJS $emit $broadcast $on //change $scope.mySelectControllerChange=function(){ var data=null; if(null==$scope.myColumnSelectModel){ data={ pa:'',pb:'' }; }else{ data={ pa:$scope.myColumnSelectModel,pb:$scope.myColumnSelectModel.optionGroupId }; } $scope.$emit('to_myParentController_on_myColumnSelectModel_change',data); } /*myParentController*/ angular.module('activitiModeler').controller('myParentController',['$rootScope','$scope','$timeout','$window',function ($rootScope,$scope,$timeout,$window) { //选择字段下拉列表,触发关系符下拉 $scope.$on('to_myParentController_on_myColumnSelectModel_change',function(event,data){ $scope.$broadcast('to_myRelationController_on_myColumnSelectModel_change',data); }); }]); /*关系符*/ angular.module('activitiModeler').controller('myRelationController',$window) { $scope.myRelationDisableVar=true; $scope.objDisableTrue=true;//加上灰背景 //接收事件-根据字段显示下拉 $scope.$on('to_myRelationController_on_myColumnSelectModel_change',data){ if(data.pa!=''){ $scope.myRelationDisableVar=false; $scope.objDisableTrue=false;//去掉灰背景 if(data.pb!=null && data.pb!=''){ //有optionGroup $scope.relationList = [{id:0,name:'包含'}]; }else{ //没有optionGroup $scope.relationList = [{id:0,name:'包含'}]; } }else{ $scope.relationList=null; $scope.myRelationDisableVar=true; $scope.objDisableTrue=true;//加上灰背景 } }); }]); (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
相关内容
- angularjs – Angular UI Bootstrap monthpicker
- Docker数据卷
- scala – 在SAP HANA中选择Hibernate抛出错误:`不支持com.
- .net WebService(一) 无传入参数WebService
- Advanced Programming in UNIX Environment Episode 27
- Bootstrap网格系统
- symbolic-link – 使用“Link Shell Extension”时,“符号链
- 什么相当于较新的Angular中的ngSrc?
- unix – 有没有办法防止后台任务的输出覆盖shell中的命令行
- 从工作目录启动gvim