angularjs之级联菜单
angularjs之级联菜单
原理:
1.ng-options中val.id as val.name for val in cascading 将id的值赋给 mg-modelone
2.在通过ng-change传给函数
3.当一级下拉菜单的值改变后,执行函数,去后台请求二级下拉菜单的数据,并加载
angularjs代码:
app.controller('addmultiple_scontroller', function($scope, $http) { //常量 $scope.postCfg = postCfg; $scope.modelone = ""; $scope.modeltwo = ""; $http.post("./getAllExamNameByTid.action").success(function(res) { $scope.cascading = res; }); $scope.changeone = function(val) { if(null != val){ $http.post("./getAllExamClassifyByEnid.action",{ "en_id": val },$scope.postCfg).success(function(res) { $scope.cascadingtwo = res; }); } } });
html代码:
<p> <label> <span>所属题库:</span> <select ng-model="modelone" ng-options="val.id as val.name for val in cascading" ng-change="changeone(modelone)"> <option value="">--请选择--</option> </select> </label> <label> <select name="" ng-model="modeltwo" ng-options="val.id as val.name for val in cascadingtwo"> <option value="">--请选择--</option> </select> </label> </p>