1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > angularjs---select使用---默认值及联动

angularjs---select使用---默认值及联动

时间:2023-07-11 03:16:34

相关推荐

angularjs---select使用---默认值及联动

angularjs---select使用---默认值及联动

代码

一. select设置默认显示内容&&获取下拉框显示内容.HTML<div><select ng-model="current_option" ng-options="option.key for option in option_array"> </select></div>JS$(function() {/**** 设置下拉框显示内容 ****/$scope.option_array = [{"key" : "hello", "value" : 1},{"key" : "world", "value" : 2},];$scope.current_option = $scope.option_array[0]; // 下拉框默认显示内容console.log($scope.current_option.key); // 获取下拉框显示内容 console.log($scope.current_option.value); // 获取下拉框显示内容对应的值})二. select二级联动.HTML<div><select ng-model="current_option" ng-options="option.key for option in option_array" ng-change="current_option_change()"> </select></div><div><select ng-model="child_current_option" ng-options="option.key for option in child_option_array"> </select></div>JS$(function() // 这是动作, 立即执行{/**** 设置父下拉框显示内容 ****/$scope.option_array = [{"key" : "hello", "value" : 2},{"key" : "world", "value" : 2},];$scope.current_option = $scope.option_array[0];// 父下拉框默认显示内容/**** 初始加载时根据父下拉框内容显示子下拉框内容 ****/$scope.child_change_with_father();})/**** 根据父下拉框当前显示内容设置子下拉框内容 ****/$scope.child_change_with_father = function () // 这是方法, 调用执行{if ("hello" == $scope.current_option.key) {$scope.child_option_array = [{"key" : "hello_child_one", "value" : 1},{"key" : "hello_child_two", "value" : 2},];}else if ("world" == $scope.current_option.key){$scope.child_option_array = [{"key" : "world_child_one", "value" : 3},{"key" : "world_child_two", "value" : 4},];}$scope.child_current_option = $scope.child_option_array[0]; // 子下拉框默认显示内容}$scope.current_option_change = function() {$scope.child_change_with_father();}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。