<nav id="local-nav">
    <ul class="nav nav-list">
        <li>
            <div>
                <span class="toggle">Realms</span>
            </div>
            <ul>
                <li data-ng-repeat="r in realms" data-ng-class="realm.key == r.key && 'active'">
                    <a href=#/realms/{{r.key}}>{{r.name}}</a>
                    <ul class="sub-items" data-ng-show="realm.key == r.key">
                        <li data-ng-class="!path[2] && 'active'"><a href="#/realms/{{r.key}}">Configuration</a></li>
                        <li data-ng-class="path[2] == 'users' && 'active'"><a href="#/realms/{{r.key}}/users">Users</a></li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</nav>