angularjs 中的路由 与 bootstrap标签选项卡的冲突 解决方案
当项目中使用了angularjs 的路由,则所有 像a标签的href 的链接都会走路由,实现页面跳转,那么有些地方需要使用选项卡,就会带来麻烦。
路由使用如下图:

某页面需要使用bootstrap的选项卡,如下图:

此时,点击选项卡,页面就跳转了,是不能正常工作的。
解决此问题,只需将href更改为data-target即可:

问题成功解决。
然而,网上也有说tab标签使用时,在#id前加 / ,即写成href=="/#home" 的形式,但通过测试,此方式行不通,不知是否没理解真正写法。
angularjs 中的路由 与 bootstrap标签选项卡的冲突 解决方案的更多相关文章
- 关于AngularJs中的路由学习总结
AngularJs中的路由,应用比较广泛,主要是允许我们通过不同的url访问不同的内容,可实现多视图的单页web应用.下面看看具体怎么使用. 关于路由 通常我们的URL形式为http://jtjds ...
- angularjs中的路由介绍详解 ui-route(转)
http://www.cnblogs.com/littlemonk/p/5500801.html 这篇文章主要介绍了Angularjs中UI Router全攻略,涉及到angularjs ui rou ...
- angularjs中的路由介绍详解 ui-route
这篇文章主要介绍了Angularjs中UI Router全攻略,涉及到angularjs ui router的基本用法,需要的朋友参考下吧 首先给大家介绍angular-ui-router的基本用 ...
- angularJS中-$route路由-$http(ajax)的使用
后台请求使用的是nodeJS驱动(后面帖代码),很简单的RESTFUL, 页面使用的是bottstarp3.0(懒人神器); 第一个例子: 在本地架设NODEJS, angular的所有请求都是请求本 ...
- angularjs中使用 <input type="file">标签实现一次最多上传5张图片
前期准备: 1.angular.js 2.bootstrap.css 具体如何实现呢?请看下面代码哈哈哈. 在angular项目中,如果要给<input type="file" ...
- angularJs 中ui-router 路由向controller传递数据
页面上 : ui-sref="home.dataAnalysis({role:'thirdpart:tokenverify',menuType:'a'})" 路由设置 .state ...
- jQuery库中的变量$和其它类库的变量$冲突解决方案
jQuery.noConflict();//把变量$给其它插件 /* 由于把jQuery插件中的变量$给了其它插件使用 那么在调用jQuery插件的时候只能使用jQuery 但是这样很不方便 1.其实 ...
- Android Studio中依赖第三库导致support版本冲突解决方案
1.今天在Android Studio的app/gradle文件中依赖文件选择器的第三方库:“com.leon:lfilepickerlibrary:1.8.0” 时,github地址:https:/ ...
- 同一页面中引入多个JS库产生的冲突解决方案(转)
发生JS库冲突的主要原因:与jQuery库一样,许多JS库都使用‘$’符号作为其代号.因此在一个页面中引入多个JS库,并且使用‘$’作为代号时,程序不能识别其代表哪个库(这个是我自己的解释,但更深的原 ...
随机推荐
- 解决PHP7无法监听9000端口问题/502错误解决办法
问题背景 昨晚帮配置nginx+php服务的时候,发生了一个奇怪的事情netstat -anp|grep 9000查看9000端口,一直没有监听,于是nginx无法通过fastcgi来代理php请求. ...
- 利用Shell命令与HDFS进行交互
以”./bin/dfs dfs”开头的Shell命令方式 1.目录操作 在HDFS中为hadoop用户创建一个用户目录(hadoop用户) 在用户目录下创建一个input目录, HDFS的根目录下创建 ...
- Calcite分析 - RelTrait
RelTrait 表示RelNode的物理属性 由RelTraitDef代表RelTrait的类型 /** * RelTrait represents the manifestation of a r ...
- 微信小程序实例:分享给一个人还是分享到群的判断代码
微信小程序的分享功能,在最新版库的ide上已经不能拿到分享回调了,官方api也删除了对应的回调函数,看样子是砍掉了,不过真机测试还是可以的,话不多说,上代码: /* // 分享功能回调 onLoad: ...
- Learning Face Age Progression: A Pyramid Architecture of GANs-1-实现人脸老化
Learning Face Age Progression: A Pyramid Architecture of GANs Abstract 人脸年龄发展有着两个重要的需求,即老化准确性和身份持久性, ...
- linux centos7 防止暴力破解
系统 centos 7.4 系统, 不知道的可以用 cat /etc/redhat-release 查看 利用到了linux 系统的日志,每次我们登陆服务器时,如果有登陆认证失败的情况,会在服务器的/ ...
- Python - Django - form 组件常用的字段和字段参数
邮箱: views.py: from django import forms from django.forms import widgets class RegForm(forms.Form): e ...
- TortoiseGit 查看单个文件日志显示全部提交记录了 解决办法
右击文件,Show log.后来在界面上发现,“显示整个工程”的选项.才发现不能勾这个. 去掉勾选,就可以看到单个文件日志了,如果勾选"All Branches"就可以看到该文件在 ...
- LODOP打印项水平居中
LODOP控制打印项水平居中,可以用如下语句,该语句控制的是打印项本身在纸张中水平居中.LODOP.SET_PRINT_STYLEA(0,"Horient",2);这个根据大的打印 ...
- DotNetty是微软的Azure团队,使用C#实现的Netty的版本发布
DotNetty是微软的Azure团队,使用C#实现的Netty的版本发布 Netty(DotNetty)原理解析 一.背景介绍 DotNetty是微软的Azure团队,使用C#实现的Netty的版本 ...