angular.js实现二级tab切换

 1 <div class="guide-type">
 2         <h3 ng-class="{true:'active', false:''}[tab == 'pc' || tab == 'weixin' || tab == 'app']" ng-click="selectTab('pc');">系统介绍</h3>
 3         <ul ng-show="tab == 'pc' || tab == 'weixin' || tab == 'app'">
 4             <li ng-class="{true:'active', false:''}[tab == 'pc']" ng-click="selectTab('pc');">门户网站</li>
 5             <li ng-class="{true:'active', false:''}[tab == 'weixin']" ng-click="selectTab('weixin');">微信公众号</li>
 6             <li ng-class="{true:'active', false:''}[tab == 'app']" ng-click="selectTab('app');">APP</li>
 7         </ul>
 8     </div>
 9     <div class="guide-type">
10         <h3 ng-class="{true:'active', false:''}[tab == 'transfer' || tab == 'rent' || tab == 'mortgage']" ng-click="selectTab('transfer');">业务办理</h3>
11         <ul ng-show="tab == 'transfer' || tab == 'rent' || tab == 'mortgage'">
12             <li ng-class="{true:'active', false:''}[tab == 'transfer']" ng-click="selectTab('transfer');">转让业务</li>
13             <li ng-class="{true:'active', false:''}[tab == 'rent']" ng-click="selectTab('rent');">出租业务</li>
14             <li ng-class="{true:'active', false:''}[tab == 'mortgage']" ng-click="selectTab('mortgage');">抵押业务</li>
15         </ul>
16     </div>
17     <div class="guide-type">
18         <h3 ng-class="{true:'active', false:''}[tab == 'deposit']" ng-click="selectTab('deposit');">保证金缴纳指南</h3>
19     </div>
20     <div class="guide-type">
21         <h3 ng-class="{true:'active', false:''}[tab == 'register' || tab == 'service']" ng-click="selectTab('register');">常见问题</h3>
22         <ul ng-show="tab == 'register' || tab == 'service'">
23             <li ng-class="{true:'active', false:''}[tab == 'register']" ng-click="selectTab('register');">如何进行网站注册</li>
24             <li ng-class="{true:'active', false:''}[tab == 'service']" ng-click="selectTab('service');">如何申请成为中介</li>
25         </ul>
26     </div>

 

转载于:https://www.cnblogs.com/zhangchs/p/9235762.html