angular.js实现二级tab切换
<div class="guide-type">
<h3 ng-class="{true:'active', false:''}[tab == 'pc' || tab == 'weixin' || tab == 'app']" ng-click="selectTab('pc');">系统介绍</h3>
<ul ng-show="tab == 'pc' || tab == 'weixin' || tab == 'app'">
<li ng-class="{true:'active', false:''}[tab == 'pc']" ng-click="selectTab('pc');">门户网站</li>
<li ng-class="{true:'active', false:''}[tab == 'weixin']" ng-click="selectTab('weixin');">微信公众号</li>
<li ng-class="{true:'active', false:''}[tab == 'app']" ng-click="selectTab('app');">APP</li>
</ul>
</div>
<div class="guide-type">
<h3 ng-class="{true:'active', false:''}[tab == 'transfer' || tab == 'rent' || tab == 'mortgage']" ng-click="selectTab('transfer');">业务办理</h3>
<ul ng-show="tab == 'transfer' || tab == 'rent' || tab == 'mortgage'">
<li ng-class="{true:'active', false:''}[tab == 'transfer']" ng-click="selectTab('transfer');">转让业务</li>
<li ng-class="{true:'active', false:''}[tab == 'rent']" ng-click="selectTab('rent');">出租业务</li>
<li ng-class="{true:'active', false:''}[tab == 'mortgage']" ng-click="selectTab('mortgage');">抵押业务</li>
</ul>
</div>
<div class="guide-type">
<h3 ng-class="{true:'active', false:''}[tab == 'deposit']" ng-click="selectTab('deposit');">保证金缴纳指南</h3>
</div>
<div class="guide-type">
<h3 ng-class="{true:'active', false:''}[tab == 'register' || tab == 'service']" ng-click="selectTab('register');">常见问题</h3>
<ul ng-show="tab == 'register' || tab == 'service'">
<li ng-class="{true:'active', false:''}[tab == 'register']" ng-click="selectTab('register');">如何进行网站注册</li>
<li ng-class="{true:'active', false:''}[tab == 'service']" ng-click="selectTab('service');">如何申请成为中介</li>
</ul>
</div>
angular.js实现二级tab切换的更多相关文章
- 【angular】angular实现简单的tab切换
html: <div class="list-group" ng-repeat="tab in menuList"> <a href=&quo ...
- Angular——tab切换案例
基本介绍 angular框架下的tab切换,相比较于之前的纯js写的代码,有一个很大的特点就是以数据为驱动,基本上不用搜索dom元素就可以实现效果 基本使用 (1)导航部分使用的是的状态使用的是ng- ...
- 又一Tab切换效果(js实现)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js用户管理中心tab切换界面模板
效果体验:http://hovertree.com/texiao/js/27/ 效果图如下: 代码如下: <!DOCTYPE html> <html> <head> ...
- JS实现Tab切换
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js或者jq的tab切换
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- 使用swiper.js实现移动端tab切换
在项目中遇到的,要实现tab切换,我用的是swiper.js 官网:http://www.swiper.com.cn/api/start/new.html <!DOCTYPE html> ...
- bootstrap 标签页tab切换js(含报错原因)
booststrap 标签页的tab切换,相信大家已经都很熟悉了,在boot官网示例以及其他网站已经很多罗列相关代码的了,这里就不赘述了.这里主要贴下让boot标签页默认显示哪个标签页的js. 主要留 ...
- js Tab切换实例
js 实现 tab 切换 实现如下效果: 1.图片每1秒钟切换1次. 2.当鼠标停留在整个页面上时,图片不进行轮播. 3.当点击切换页的选项上时,出现该选项的对应图片,而且切换页选项的背景颜色发生相应 ...
随机推荐
- Centos7 安装配置Apache+Mysql5.7+PHP7.0+phpmyadmin
Centos7 下安装配置Apache+Mysql5.7+PHP7.0+phpmyadmin 搭建LAMP =========================================Apach ...
- C语言I博客作业008
这个作业属于那个课程 C语言程序设计II 这个作业要求在哪里 http://edu.cnblogs.com/campus/zswxy/SE2019-3/homework/9982 我在这个课程的目标是 ...
- static关键字_1
static关键字 1.在类中,用static声明的成员变量为静态成员变量,它为该类的公用变量,在第一次使用时被初始化,对于该类的所以对象来说,static成员变量只有一份. 2.用static声 ...
- Java并发AtomicLong接口
java.util.concurrent.atomic.AtomicLong类提供了可以被原子地读取和写入的底层long值的操作,并且还包含高级原子操作. AtomicLong支持基础long类型变量 ...
- VS2013编译程序出现error C4996: 'std::_Fill_n': Function call with parameters that may be unsafe
最近按照BiliBil网站Visual C++网络项目实战视频教程,使用VS2013编写一个基于MFC的对话框程序HttpSourceViewer,采用了WinHttp库.Boost xpressiv ...
- 洛谷 P1346 电车——dijstra
上一波题目 https://www.luogu.org/problem/P1346 是道水题 路口一开始对着的那条路权值为0 其余路权值为1 然后跑一遍最短路就好了 qwq #include<c ...
- Vue.config.silent = true
Vue.config vue的全局配置文件 silent默认值是false Vue.config.silent = true 取消Vue所有的日志和警告
- thinkphp中的exp查询
今天遇到一个问题,就是在vendor表中查询出vendor_id = vendor_f_id的数据,其实使用原生的sql语句是非常简单的: select * from vendor where ven ...
- 37.Sort Colors(颜色排序)
Level: Medium 题目描述: Given an array with n objects colored red, white or blue, sort them in-place s ...
- BUUCTF weirdlist 一路到底
Weird list 这题恶心的一批 给了一堆列表 这...这是人做的题吗... 放飞自我,打开脑洞 把‘1’空出来,其他数字换为‘*’画出来 然后看到了flag,但是 这...这是什么flag,ag ...