active
AngularJS は、現在のページのリンクにクラスを設定する際に役立ちますか?
これを実現する魔法のような方法があると思うのですが、見つけることができません。
私のメニューは次のようになります:
<ul>
<li><a class="active" href="/tasks">Tasks</a>
<li><a href="/actions">Tasks</a>
</ul>
そして、ルートにはそれぞれに対するコントローラーがあります:TasksController
およびActionsController
。
a
しかし、リンク上の「アクティブ」クラスをコントローラーにバインドする方法がわかりません。
何かヒントはありますか?
ベストアンサー1
展示中
<a ng-class="getClass('/tasks')" href="/tasks">Tasks</a>
コントローラーで
$scope.getClass = function (path) {
return ($location.path().substr(0, path.length) === path) ? 'active' : '';
}
これにより、タスク リンクは '/tasks' で始まるすべての URL でアクティブ クラスを持つようになります (例: '/tasks/1/reports')