AngularJS是否以任何方式帮助在active
当前页面的链接上设置类?
我想有一些神奇的方法,但我似乎无法找到.
我的菜单看起来像:
<ul>
<li><a class="active" href="/tasks">Tasks</a>
<li><a href="/actions">Tasks</a>
</ul>
Run Code Online (Sandbox Code Playgroud)
我在路线上为每个人配备了控制器:TasksController
和ActionsController
.
但我无法想出一种方法来绑定a
控制器链接上的"活动"类.
任何提示?
我在AngularJS中设置的路由如下:
$routeProvider
.when('/dashboard', {templateUrl:'partials/dashboard', controller:widgetsController})
.when('/lab', {templateUrl:'partials/lab', controller:widgetsController})
Run Code Online (Sandbox Code Playgroud)
我在顶部栏上有一些链接,用作标签.如何根据当前模板或网址将"有效"类添加到选项卡?
如何在Angular 2中设置Bootstrap navbar"active"类?我只找到了Angular 1方式.
当我转到" 关于"页面时,添加class="active"
到" 关于",然后class="active"
在" 主页"上删除.
<ul class="nav navbar-nav">
<li class="active"><a [routerLink]="['Home']">Home</a></li>
<li><a [routerLink]="['About']">About</a></li></li>
</ul>
Run Code Online (Sandbox Code Playgroud)
谢谢
从angularjs作为新手开始我创建了一个导航栏.它有几个子菜单.但我不完全确定使用angularjs处理它的最佳做法是什么.我想跟踪当前选定的菜单项以使其"活动",并根据选择更改渲染的模板.
我正在寻找可以在生产环境中使用的一些示例或一些示例代码.
抱歉这个非常通用的问题,但我希望有人可以帮助我.
我有以下配置:
$routeProvider
.when('/cars', { templateUrl: 'app/cars/index.html', controller: 'CarsCtrl', reloadOnSearch: false })
.when('/bikes', { templateUrl: 'app/bikes/index.html', controller: 'BikesCtrl', reloadOnSearch: false });
Run Code Online (Sandbox Code Playgroud)
在我的根index.html的某个地方有一个:
<a href="#/cars">Cars</a>
<a href="#/bikes">Bikes</a>
<div ng-view></div>
Run Code Online (Sandbox Code Playgroud)
现在,我希望在DOM中同时加载和生成两个视图,并根据路由/ URL显示其中一个.
类似下面的内容(不是实际的工作代码,只是为了给你一个想法).
app.js:
$routeProvider
.when('/cars', { controller: 'CarsCtrl', reloadOnSearch: false })
.when('/bikes', { controller: 'BikesCtrl', reloadOnSearch: false });
Run Code Online (Sandbox Code Playgroud)
root index.html:
<a href="#/cars">Cars</a>
<a href="#/bikes">Bikes</a>
<div ng-include="'app/cars/index.html'" ng-show="carsVisible"></div>
<div ng-include="'app/bikes/index.html'" ng-show="bikesVisible"></div>
Run Code Online (Sandbox Code Playgroud)
更新:我知道ng-view类型可以做到这一点,但差异,如果微妙,存在.我希望每个视图的html生成一次并始终保留在DOM中.