树视图表更改字体真棒颜色

时间:2018-02-14 18:28:37

标签: css angularjs

我有一个树视图,你点击fa-plus-square-o,当它展开fa-minus-square-o时。

我正在使用ng-class来显示它们。我需要做的是将fa-minus-square-o颜色改为白色。但是,我确实有另一个页面具有相同类型的树视图。因此,直接在CSS WORKS中引用fa-minus-square-o,以及"更改"另一页上的那个。所以,我不能这样做!!!!我需要它只影响页面树视图上的当前页面。

HTML表树视图

 <table class="users-tree-view-table">
        <tbody class="users-tree-view-tbody">
        <tr ng-repeat="user in users" ng-class="{selectedUserRole: user === selectedUser}">
            <td class="users-tree-view-column">
                <div class="users-tree-view-row">
                    <span class="fa users-tree-view-toggle" ng-class="{'fa-plus-square-o' : user.isUserCollapsed, 'fa-minus-square-o' : !user.isUserCollapsed}" ng-click="clickedUserNode(user); user.isUserCollapsed = !user.isUserCollapsed"></span>
                    {{user.userName}}
                </div>
                <div uib-collapse="user.isUserCollapsed">
                    <table class="users-tree-view-subtable">
                        <tbody class="users-tree-view-tbody">
                        <tr id="role-{{$index}}"  ng-repeat="role in user.userRoles"  ng-click="setSelectedUserRole(user, role)" ng-class="{true: 'selectedUserRole', false: 'unselectedUserRole'}[user === selectedUser && role === selectedRole]">
                            <td class="users-tree-view-column">
                                <div >
                                    <div class="users-tree-view-row">
                                        <span style="padding-left:45px">{{role}}</span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        </tbody>
                    </table>

                </div>
            </td>
        </tr>
        </tbody>
    </table>

将鼠标悬停在 fa-minus-square-o 上,我看到我需要以某种方式引用 fa users-tree-view-toggle fa-minus-square-o CSS?

如何在不影响其他页面上所有其他字体的情况下引用一个特定的字体真棒?

0 个答案:

没有答案