Question

如何在角度材质中路由到特定菜单后突出显示（在侧面导航中）菜单项（在选中）？如果有人得到解决方案，这将是有用的。

<md-sidenav layout="column" class="md-sidenav-left md-whiteframe-z2" 
  md-component-id="left" md-is-locked-open="$mdMedia('gt-sm')">  
    <menu-link section="page" class="ng-isolate-scope">
        <a class="md-button md-ink-ripple active" ui-sref="customer">test1</a>
    </menu-link>
    <menu-link section="page" class="ng-isolate-scope">
        <a class="md-button md-ink-ripple active" ui-sref="project">test2</a>
    </menu-link>
    <menu-link section="page" class="ng-isolate-scope">
        <a class="md-button md-ink-ripple active" ui-sref="material">test3</a>
    </menu-link>
    <menu-link section="page" class="ng-isolate-scope">
        <a class="md-button md-ink-ripple active" ui-sref="boq">test6</a>
    </menu-link>
    <menu-link section="page" class="ng-isolate-scope">
        <a class="md-button md-ink-ripple active" ui-sref="supplier">test8</a>
    </menu-link>
    <menu-link section="page" class="ng-isolate-scope">
        <a class="md-button md-ink-ripple active" ui-sref="order">test10</a>
    </menu-link>
    <menu-link section="page" class="ng-isolate-scope">
        <a class="md-button md-ink-ripple active" ui-sref="invoice">test78</a>
    </menu-link> 
    <menu-link section="page" class="ng-isolate-scope">
        <a class="md-button md-ink-ripple active" ui-sref="enquiry">test89</a>
    </menu-link> 
</md-sidenav>

Answer 1

将ui-sref-active="active"添加到每个链接。请参阅下面的示例。

<menu-link section="page" class="ng-isolate-scope">
    <a class="md-button md-ink-ripple" ui-sref="customer" ui-sref-active="active">
        test1
    </a>
</menu-link>

当用户在active或其子路由中指定的路由时，该链接将具有ui-sref类。您可以使用该类以任何方式设置活动项的样式。

如何在菜单项路由到其特定菜单后突出显示该菜单项？

1 个答案: