如何使用AngularJS鏈接下拉列表？

Question

對不起，標題不好，我真的不知道如何更好地表達它，如果有人可以對其進行修改以使其更適合我的想法，那將是很好的。

我想做的是單擊一個公司->將加載所有給定公司部門，當我單擊一個部門時，將顯示該部門中的所有職位。

模板：

            <label>
                <span style="float: left; width: 100px;">Company</span>
                <select multiple style="width: 670px; float: left; height: 150px;">
                    <option>All</option>
                    <option disabled="disabled">-----------------------</option>
                    <option ng-repeat="employee in employees | unique: 'company'" ng-bind="employee.company.name"></option>
                </select>
            </label>

            <label>
                <span style="float: left; width: 100px;">Department</span>
                <select multiple style="width: 670px; float: left; height: 150px;">
                    <option>All</option>
                    <option disabled="disabled">-----------------------</option>
                    <option ng-repeat="employee in employees | unique: 'department'" ng-bind="employee.department.name"></option>
                </select>
            </label>

            <label>
                <span style="float: left; width: 100px;">Position</span>
                <select multiple style="width: 670px; float: left; height: 150px;">
                    <option>All</option>
                    <option disabled="disabled">-----------------------</option>
                    <option ng-repeat="employee in employees | unique: 'position'" ng-bind="employee.position.name"></option>
                </select>
            </label>

控制器：

$scope.employees = ContactsApi.Employee.query().$promise.then(function(response) {
    return response;
});

Answer 1

您需要在當前范圍內為下拉列表的當前值（例如currentCompany，currentDepartment和currentEmployee）創建三個屬性，將它們綁定到select標記並為每個標記創建監視。 然后，在使用$ watch設置的回調函數中，可以加載下一個下拉列表的值（您可能還希望在本地緩存值）。 請參閱本節以獲取更多信息（對簡短的回答很抱歉，稍后我將嘗試添加更多詳細信息）。