This article describes the select secondary linkage drop-down menu function implemented by AngularJS. Share it for your reference, as follows:
<!DOCTYPE html>
<html ng-app>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<script src="../script/"></script>
<body ng-controller="Controller">
<div>Category：
<select ng-model="selected1" ng-options=" for m in classification1" ng-change="changeClassification(selected1)">
<option value="">-- Please select --</option>
</select>
<select ng-model="selected2" ng-options=" for m in classification2">
<option value="">-- Please select --</option>
</select>
</div>
</body>
<script>
var contantCroleList = [
{ "roleName" : "Software Development", "roleId" : "role1", "children" : [
{ "roleName" : "Software AAA", "roleId" : "role11", "children" : [] },
{ "roleName" : "Software BBB", "roleId" : "role12", "children" : []},
{ "roleName" : "Software CCC", "roleId" : "role12", "children" : []},
{ "roleName" : "Software DDD", "roleId" : "role12", "children" : []},
{ "roleName" : "Software EEE", "roleId" : "role12", "children" : []},
{ "roleName" : "Software FFF", "roleId" : "role12", "children" : []}
]},
{ "roleName" : "Hardware Development", "roleId" : "role2", "children" : [
{ "roleName" : "Hardware AAA", "roleId" : "role21", "children" : [] },
{ "roleName" : "Hardware BBB", "roleId" : "role22", "children" : []},
{ "roleName" : "Hardware CCC", "roleId" : "role23", "children" : []},
{ "roleName" : "Hardware DDD", "roleId" : "role24", "children" : []},
{ "roleName" : "Hardware EEE", "roleId" : "role25", "children" : []},
{ "roleName" : "Hardware FFF", "roleId" : "role26", "children" : []}
]},
{ "roleName" : "Embedded Development", "roleId" : "role3", "children" : [
{ "roleName" : "Embedded AAA", "roleId" : "role31", "children" : [] },
{ "roleName" : "Embedded BBB", "roleId" : "role32", "children" : []},
{ "roleName" : "Embedded CCC", "roleId" : "role33", "children" : []},
{ "roleName" : "Embedded DDD", "roleId" : "role34", "children" : []},
{ "roleName" : "Embedded EEE", "roleId" : "role35", "children" : []},
{ "roleName" : "Embedded FFF", "roleId" : "role36", "children" : []}
]}
];
function Controller($scope) {
$scope.classification1 = contantCroleList;
$ = function (selected1) {
$scope.classification2 = ;
};
}
</script>
</html>
For more information about AngularJS, readers who are interested in view the topic of this site:Summary of AngularJS command operation skills》、《AngularJS Introduction and Advanced Tutorial"and"AngularJS MVC architecture summary》
I hope this article will be helpful to everyone's AngularJS programming.