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

路由使用如下图:

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

此时,点击选项卡,页面就跳转了,是不能正常工作的。

解决此问题,只需将href更改为data-target即可:

问题成功解决。

然而,网上也有说tab标签使用时,在#id前加 / ,即写成href=="/#home" 的形式,但通过测试,此方式行不通,不知是否没理解真正写法。

angularjs 中的路由 与 bootstrap标签选项卡的冲突 解决方案的更多相关文章

  1. 关于AngularJs中的路由学习总结

    AngularJs中的路由,应用比较广泛,主要是允许我们通过不同的url访问不同的内容,可实现多视图的单页web应用.下面看看具体怎么使用. 关于路由  通常我们的URL形式为http://jtjds ...

  2. angularjs中的路由介绍详解 ui-route(转)

    http://www.cnblogs.com/littlemonk/p/5500801.html 这篇文章主要介绍了Angularjs中UI Router全攻略,涉及到angularjs ui rou ...

  3. angularjs中的路由介绍详解 ui-route

    这篇文章主要介绍了Angularjs中UI Router全攻略,涉及到angularjs ui router的基本用法,需要的朋友参考下吧   首先给大家介绍angular-ui-router的基本用 ...

  4. angularJS中-$route路由-$http(ajax)的使用

    后台请求使用的是nodeJS驱动(后面帖代码),很简单的RESTFUL, 页面使用的是bottstarp3.0(懒人神器); 第一个例子: 在本地架设NODEJS, angular的所有请求都是请求本 ...

  5. angularjs中使用 <input type="file">标签实现一次最多上传5张图片

    前期准备: 1.angular.js 2.bootstrap.css 具体如何实现呢?请看下面代码哈哈哈. 在angular项目中,如果要给<input type="file" ...

  6. angularJs 中ui-router 路由向controller传递数据

    页面上 : ui-sref="home.dataAnalysis({role:'thirdpart:tokenverify',menuType:'a'})" 路由设置 .state ...

  7. jQuery库中的变量$和其它类库的变量$冲突解决方案

    jQuery.noConflict();//把变量$给其它插件 /* 由于把jQuery插件中的变量$给了其它插件使用 那么在调用jQuery插件的时候只能使用jQuery 但是这样很不方便 1.其实 ...

  8. Android Studio中依赖第三库导致support版本冲突解决方案

    1.今天在Android Studio的app/gradle文件中依赖文件选择器的第三方库:“com.leon:lfilepickerlibrary:1.8.0” 时,github地址:https:/ ...

  9. 同一页面中引入多个JS库产生的冲突解决方案(转)

    发生JS库冲突的主要原因:与jQuery库一样,许多JS库都使用‘$’符号作为其代号.因此在一个页面中引入多个JS库,并且使用‘$’作为代号时,程序不能识别其代表哪个库(这个是我自己的解释,但更深的原 ...

随机推荐

  1. 怎么在浏览器设置cookie

    document.cookie="jwt=xxxxxx" 遇到了一个bug 开了代理没有办法做图片上传

  2. 什么是TCP粘包?怎么解决这个问题

    在socket网络编程中,都是端到端通信,由客户端端口+服务端端口+客户端IP+服务端IP+传输协议组成的五元组可以明确的标识一条连接.在TCP的socket编程中,发送端和接收端都有成对的socke ...

  3. Servlet使用反射机制

    传统servlet存在的问题 每一个不同的请求都要写Servlet,导致整个项目servlet过多,不易维护 解决方案 同一个模块只写一个Servlet,然后每一个请求传一个参数,后台根据参数取调用不 ...

  4. SQL学习回顾

    --本文源自<黑马程序员>

  5. 解读 | 你真正理解什么是Cloud Native吗?

    你能做到每周.每天甚至每个钟头向客户发布新特性吗?新加入的开发者能够在他们工作的第一天甚至面试阶段就能部署代码吗?部署新员工的代码后,你能因为确信应用程序运行正常而安然入睡吗?建立快速发布机制,包括支 ...

  6. Nim游戏博弈(收集完全版)

    Nim游戏证明参见: 刘汝佳训练指南P135-写的很酷! 知乎上SimonS关于Nim博弈的回答! Nim游戏的概述: 还记得这个游戏吗? 给出n列珍珠,两人轮流取珍珠,每次在某一列中取至少1颗珍珠, ...

  7. Software Engineering Continuous Integration Eclipse Mylyn

  8. svg的viewport和viewbox

    svg中视区重要的概念 1. viewport  视口,相当于显示器屏幕 2. viewbox   视区,相当于在屏幕上截取一小块,放大到整个屏幕,就是特写的效果 3. preserveAspectR ...

  9. express下使用ES6

    //环境切换配置 package.json scripts:{ "service": "NODE_ENV=production PORT=3000 npm start&q ...

  10. 思维导图Xmind8

    Xmind——一款强大的思维导图工具,方便记忆和理清思路,同时思维导图特殊的记录方式也便于捕捉跳跃思考. 五款思维导图软件:MindManager.iMindMap.XMind.MindMapper. ...