JS代码

 $scope.tabs = [];
$rootScope.data = {
current: "3" // 1代表张三,2代表李四,3代表王五
};
$rootScope.actions =
{
setCurrent: function (param) {
$rootScope.data.current = param;
}
} $scope.tabs.push({ title: '工作组', current: 2, show: true });
$scope.tabs.push({ title: '个人', current: 3, show: true });

 html代码

<ul class="nav nav-tabs">
<li role="presentation" ng-repeat="tab in tabs" ng-class="{ 'active' : data.current == tab.current }"><a href="" ng-click="actions.setCurrent(tab.current)">{{tab.title}}</a></li>
</ul>

  

angluarjs的tab标签的更多相关文章

  1. JS特效之Tab标签切换

    在我们平时浏览网站的时候,经常看到的特效有图片轮播.导航子菜单的隐藏.tab标签的切换等等.这段时间学习了JS后,开始要写出一些简单的特效.今天我也分享一个简单tab标签切换的例子.先附上代码: HT ...

  2. 支持自动切换的tab标签代码札记

    html代码如下: <!-- tab标签代码begin --> <div class="tab1" id="tab1"> <div ...

  3. 多iframe使用tab标签方式添加、删除、切换的处理实例

    紧接着上一篇随笔iframe的内容增高或缩减时设置其iframe的高度的处理方案 如果采用iframe来切换显示内容的方式来展现办公Web.那么需要解决几个问题 1.tab标签需要和显示的iframe ...

  4. 类似掌盟的Tab页 Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签 (转)

    原博客地址  :http://blog.csdn.net/xiaanming/article/details/10766053 本文转载,记录学习用,如有需要,请到原作者网站查看(上面这个网址) 之前 ...

  5. jquery插件之tab标签页或滑动门

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的tab标签页或滑动门特效,在此插件中默认使用的是鼠标滑过 ...

  6. Jquery LigerUI框架学习(二)之Tree于Tab标签实现iframe功能

    LigerUI框架Tree于Tab标签动态使用,当点击Tree后动态创建Tab标签,和通常用的iframe框架功能类似 Tree中的关键代码 //Tree初始化 $("#tree1" ...

  7. Android(java)学习笔记129:Tab标签的使用

    1.案例1---TabProject (1)首先是main.xml文件: <?xml version="1.0" encoding="utf-8"?> ...

  8. 如何一行jquery代码写出tab标签页(链式操作)

    啦啦!今天又学了一招,js写几十行的tab标签页jquery写一行就行啦,用到了链式操作!以下是代码: <!DOCTYPE html> <html lang="en&quo ...

  9. 基于duilib实现的可滑动tab标签控件

    最近一直在忙棋牌游戏大厅的开发,使用了duilib界面库,在大厅界面游戏菜单的展现上需要用到滑动的效果,类似悠扬棋牌,jj棋牌的菜单左右(上下)滑动的效果.通过自己的设计思路完善了一个可滑动的tab标 ...

随机推荐

  1. Python爬虫进阶四之PySpider的用法

    审时度势 PySpider 是一个我个人认为非常方便并且功能强大的爬虫框架,支持多线程爬取.JS动态解析,提供了可操作界面.出错重试.定时爬取等等的功能,使用非常人性化. 本篇内容通过跟我做一个好玩的 ...

  2. 2018年3大UI设计趋势,你知道吗?

    以下内容由Mockplus团队翻译整理,仅供学习交流,Mockplus是更快更简单的原型设计工具. 之前小编已经和大家讨论了2018年软件测试的五大趋势,现在让我们一起来看看移动UI设计在2018年会 ...

  3. 数据结构(c语言版)文摘

    第一章  绪论 数据结构:是一门研究非数值计算的程序设计问题中计算机的操作对象以及它们之间的关系和操作等的学科. 数据:是对客观事物的符号表示,在计算机科学中是指所有能输入到计算机中并被计算机程序处理 ...

  4. raw格式转换成qcow2格式

    qemu-img convert -f raw redhat6.7-kvm-postgresql9.2.3-8disk-pulsar2.2 -O qcow2 redhat6.7-kvm-postgre ...

  5. 20155316 2016-2017-2 《Java程序设计》第6周学习总结

    教材学习内容总结 IO操作的目标 从数据源当中读取数据,以及将数据写入到数据目的地当中: I/O的来源地与目的地多种多样 I/O的流向:输入流.输出流.参照物 IO的分类方法 输入流\输出流: 字节流 ...

  6. canvas里调用getImageData的报security的问题

    canvas元素支持绘制任意图片元素: var ctx = document.getElementById("canvas").getContext("2d") ...

  7. opengl教程推荐

    非常不错的教程! OpenGL教程

  8. BitAdminCore框架更新日志20180524

    20180524更新内容 本次更新两个内容,一是增加windows service,二是增加邮件发送功能. windows service windows service用于定期跑服务,网上有一些提供 ...

  9. python网络编程--粘包解决方案 和 subprocess模块

    1.缓冲区:作用:将程序和网络解耦分为输入缓冲区, 输出缓冲区 每个 socket 被创建后,都会分配两个缓冲区,输入缓冲区和输出缓冲区.write()/send() 并不立即向网络中传输数据,而是先 ...

  10. IdHTTPServer使用注意问题

    如果在同一电脑上运行多个IdHTTPServer实例,IdHTTPServer使用时候,一定要注意“DefaultPort”属性,其实真正绑定端口是这个属性决定的,所以希望IdHTTPServer绑定 ...