已解決430363個問題，去搜搜看，總會有你想問的

如何使用Angular JS設置bootstrap navbar活動類？

首頁猿問如何使用Angular...

如何使用Angular JS設置bootstrap navbar活動類？

JavaScript AngularJS

一只斗牛犬 2019-08-29 08:30:59

如何使用Angular JS設置bootstrap navbar活動類？如果我在引導程序中有一個帶有項目的導航欄Home | About | Contact如何為每個菜單項激活時設置活動類？也就是說，如何設置class="active"角度路徑的時間#/ 為了家#/about 對于關于頁面#/contact 對于聯系頁面

查看完整描述

3 回答

小唯快跑啊

TA貢獻1863條經驗獲得超2個贊

一種非常優雅的方法是使用ng-controller在ng-view之外運行單個控制器：

<div class="collapse navbar-collapse" ng-controller="HeaderController">
    <ul class="nav navbar-nav">
        <li ng-class="{ active: isActive('/')}"><a href="/">Home</a></li>
        <li ng-class="{ active: isActive('/dogs')}"><a href="/dogs">Dogs</a></li>
        <li ng-class="{ active: isActive('/cats')}"><a href="/cats">Cats</a></li>
    </ul></div><div ng-view></div>

并包含在controllers.js中：

function HeaderController($scope, $location) { 
    $scope.isActive = function (viewLocation) { 
        return viewLocation === $location.path();
    };}

反對回復 2019-08-29

3 回答
0 關注
618 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何使用Angular JS設置bootstrap navbar活動類？

如何使用Angular JS設置bootstrap navbar活動類？

3 回答

添加回答

如何使用Angular JS設置bootstrap navbar活動類？