1

我有一个应用程序控制器,负责将用户添加到另一个模型。在我的应用程序中添加用户有两种方法。我们可以通过选择用户自己来添加它们,或者通过选择整个组来添加该组的所有用户。

为了使 UI 更友好一点,我认为最好有标签来单独和通过组添加用户......这样我就不必同时显示两个表单 - 用户可以翻转使用选项卡在表单之间。

为了实现选项卡,我使用了 Angular 指令,因为我在应用程序的其他地方使用了这些选项卡。这是向您展示如何实现选项卡的 html 代码:

<tabs class="tabsContainer">
    <tab-pane title="Users" class="users">
        <form name="usersForm" ng-submit="addUsers()">
            <label>Select Users Here:</label>
            <select name="selectedUsers" ng-model="selectedUsers"
                    multiple="true" ng-multiple="true"
                    ng-options="user.id as user.fullName for user in users">
            </select>
            <button type="submit">Add Users</button>
        </form>
    </tab-pane>
    <tab-pane title="User Groups" class="userGroups">
        <form name="userGroupForm" ng-submit="addUserGroups()">
            <label>Select Groups Here:</label>
            <select name="selectedUserGroups" ng-model="selectedUserGroups"
                    multiple="true" ng-multiple="true"
                    ng-options="userGroup.id as userGroup.name for userGroup in userGroups">
            </select>
            <button type="submit">Add User Groups</button>
        </form>
    </tab-pane>
</tabs>

在这个 HTML 的控制器中,我很想访问 和的tab-paneng-model 值。我原以为由于它们被定义为嵌入,所以范围将是应用程序的控制器本身,但我认为范围值实际上是在指令的范围内。这意味着在我的主应用程序控制器中,并没有定义。selectedUsersselectedUserGroupstab-pane$scope.selectedUsers$scope.selectedUserGroups

如果我暂时删除tabsandtab-pane指令,主控制器中的一切都会正常工作。所以我认为ng-model当这些指令被嵌入到tab-pane.

我如何访问它?

4

0 回答 0