有用过angular.js的吗？问一个初级问题
初次接触angular.js，看了好多天还是有点糊涂，现在想实现一个tab选项卡的效果，有一排菜单，点击其中一个，显示出对应的div，其他div隐藏，选中的菜单会改变样式，以前用jQuery非常简单，但是用angular.js不知道怎么弄，请教！
最弱Dヴ魔神
11 years, 2 months ago
Answers
http://stackoverflow.com/questions/77...
直接可以使用 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}"
BOBOBO
answered 11 years, 2 months ago