AngularJS Example:

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<div ng-app>
    <div ng-controller="TodoCtrl">
        <select ng-model="teacher" ng-options="staff.staff_name for staff in data"></select>
        <select ng-model="class" ng-options="class.class_name for class in teacher.staff_classes"></select>
    </div>
</div>

JavaScript

function TodoCtrl($scope) {
    $scope.data = [{
        "_id": "54e231b45f353d5c25cc4c30",
            "staff_email": "[email protected]",
            "staff_name": "Aarti Gupta",
            "staff_address": "South Ex., Delhi",
            "school": "54e2318d5f353d5c25cc4c0b",
            "staff_designation": "",
            "staff_mobile_no": "",
            "staff_gender": "Female",
            "staff_dob": "7-Jan-1984",
            "staff_sum": "",
            "__v": 0,
            "staff_is_classteacher": false,
            "staff_classes": [{
            "_id": "54e231a25f353d5c25cc4c1f",
                "class_name": "Class VI",
                "class_section": "B"
        }, {
            "_id": "54e231a25f353d5c25cc4c1d",
                "class_name": "Class VII",
                "class_section": "C"
        }]
    }, {
        "_id": "54e231b55f353d5c25cc4c31",
            "staff_email": "[email protected]",
            "staff_name": "AISHWARYA TANEJA",
            "staff_address": "2356/4, KAROL BAG, NEW DELHI",
            "school": "54e2318d5f353d5c25cc4c0b",
            "staff_designation": "",
            "staff_mobile_no": "",
            "staff_gender": "Female",
            "staff_dob": "21-Sep-1983",
            "staff_sum": "",
            "__v": 0,
            "staff_is_classteacher": false,
            "staff_classes": [{
            "_id": "54e231a25f353d5c25cc4c1d",
                "class_name": "Class VII",
                "class_section": "C"
        }]
    }];
}