1 <!DOCTYPE html> 2 <html ng-app="a2_15"> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title>select控件</title> 6 <script src="js/angular.js" type="text/java script"></script> 7 <style type="text/css"> 8 body { 9 font-size: 22px; 10 } 11 </style> 12 13 14 </head> 15 <body> 16 <form name="temp_form" ng-controller="c2_15"> 17 <div>学制： 18 <select ng-model="a" 19 ng-options="v.id as v.name for v in a_data" 20 ng-change="a_change(a)"> 21 <option value=""></option> 22 </select> 23 <span>{{a_show}}</span> 24 </div> 25 <div>班级： 26 <select ng-model="b" 27 ng-options="v.id as v.name group by v.grade for v in b_data" 28 ng-change="b_change(b)"> 29 <option value="">请选择</option> 30 </select> 31 <span>{{b_show}}</span></div> 32 </form> 33 34 35 </body> 36 37 38 <script type="text/java script"> 39 var a2_15 = angular.module("a2_15", []); 40 a2_15.controller("c2_15", ['$scope', function ($scope) { 41 $scope.a_data = [ 42 {id: "1001", name: "小学"}, 43 {id: "1002", name: "中学"}, 44 {id: "1003", name: "大学"} 45 ]; 46 $scope.b_data = [ 47 {id: "1001", name: "(1)班", grade: "一年级"}, 48 {id: "1002", name: "(2)班", grade: "二年级"}, 49 {id: "1003", name: "(3)班", grade: "三年级"}, 50 {id: "1004", name: "(4)班", grade: "四年级"}, 51 {id: "1005", name: "(5)班", grade: "五年级"} 52 ]; 53 $scope.a = ""; 54 $scope.b = ""; 55 // $scope.a_change = function(a){ 56 // $scope.a_show = "您选择的是："+a; 57 // } 58 // $scope.b_change = function(b){ 59 // $scope.b_show = "您选择的是："+b; 60 // } 61 }]); 62 63 </script> 64 65 </html>
