JavaScript-有用过angular.js的吗?问一个初级问题
初次接触angular.js,看了好多天还是有点糊涂,现在想实现一个tab选项卡的效果,有一排菜单,点击其中一个,显示出对应的div,其他div隐藏,选中的菜单会改变样式,以前用jQuery非常简单,但是用angular.js不知道怎么弄,请教!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
http://stackoverflow.com/questions/7792652/what-is-the-best-way-to-conditionally-apply-a-class-with-angularjs
直接可以使用 ng-class="{active: $index==selectedIndex}"
<div class="PageListBox">
<a href="##" class="" ng-repeat="page in pages" ng-class="{active: $index==selectedIndex}" ng-click="clickpage($index)">{{page.pagename}}</a>
</div>
然后还可以 在controller里面 定义selectedIndex的值 就可以设置进入页面后 默认哪个menu选中状态.
/* Controllers */
function PagesController($scope, $http, $routeParams) {
$scope.pages = [
{ siteid:1, pagename:'Homepage', pageid:101, pageorder:1, pagelayoutid:10, pageblocks:[] },
{ siteid:1, pagename:'Channel2', pageid:102, pageorder:2, pagelayoutid:10, pageblocks:[] },
{ siteid:1, pagename:'Channel3', pageid:103, pageorder:3, pagelayoutid:10, pageblocks:[] }
];
$scope.selectedIndex = 0; // left menu default selected page
// 点击切换选中的效果
$scope.clickpage = function(indexid) {
$scope.siteconfig = {selectedPageIndex :indexid};
}
}
ng-class (as of 1/19/2012) now supports an expression that must evaluate to either
1) a string of space-delimited class names, or
2) and array of class names, or 3) a map/object of class names to boolean values. So, using
3): ng-class="{selected: $index==selectedIndex}"