AngularJS利用Controller完成URL跳转


Posted in Javascript onAugust 09, 2016

具体写法举例:

1.js定义一个controller

function MyCtrl($scope, $location) {

  $scope.jumpToUrl = function(path) {

    //TODO:add code here

  };

}

2.html里面应用controller

<div ng-controller=‘MyCtrl'>

  <button ng-click="jumpToUrl('/signin')">signin</button>

</div>

3.controller里面TODO的位置填入

$location.path(path);

然后运行起来就可以看效果了。

假设当前页面的url是:http://127.0.0.1:8080/#/home

$location.path(path);执行后就会跳到http://127.0.0.1:8080/#/signin

如果你发现页面不能正常跳转,可以在$location.path(path);后面再加上一句

var curUrl = $location.absUrl(); //用来显示url全路径

调试跟踪页面时查看curUrl的值到底变成多少,大概就能猜出问题出在哪了。

好了,以上就是在AngularJS利用Controller完成URL跳转的全部内容,希望本文对大家学习AngularJS有所帮助。

Javascript 相关文章推荐
JS TextArea字符串长度限制代码集合
Oct 31 Javascript
jQuery 借助插件Lavalamp实现导航条动态美化效果
Sep 27 Javascript
js/jquery去掉空格,回车,换行示例代码
Nov 05 Javascript
谈谈AngularJs中的隐藏和显示
Dec 09 Javascript
基于JSON格式数据的简单jQuery幻灯片插件(jquery-slider)
Aug 10 Javascript
概述VUE2.0不可忽视的很多变化
Sep 25 Javascript
基于slideout.js实现移动端侧边栏滑动特效
Nov 28 Javascript
重新理解JavaScript的六种继承方式
Mar 24 Javascript
详解探索 vuex 2.0 以及使用 vuejs 2.0 + vuex 2.0 构建记事本应用
Jun 16 Javascript
基于vue-element组件实现音乐播放器功能
May 06 Javascript
mpvue构建小程序的方法(步骤+地址)
May 22 Javascript
vue-video-player 解决微信自动全屏播放问题(横竖屏导致样式错乱问题)
Feb 25 Javascript
JavaScript实现广告弹窗效果
Aug 09 #Javascript
谈谈JavaScript中的几种借用方法
Aug 09 #Javascript
Backbone View 之间通信的三种方式
Aug 09 #Javascript
Backbone中View之间传值的学习心得
Aug 09 #Javascript
全面了解函数声明与函数表达式、变量提升
Aug 09 #Javascript
jQuery 生成svg矢量二维码
Aug 09 #Javascript
浅谈JavaScript中变量和函数声明的提升
Aug 09 #Javascript
You might like
全国FM电台频率大全 - 1 北京市
2020/03/11 无线电
php下使用SimpleXML 处理XML 文件
2010/02/27 PHP
php使用$_POST或$_SESSION[]向js函数传参
2014/09/16 PHP
用js模拟JQuery的show与hide动画函数代码
2010/09/20 Javascript
P3P Header解决Cookie跨域的问题
2013/03/12 Javascript
简介JavaScript中的unshift()方法的使用
2015/06/09 Javascript
JavaScript正则表达式中的ignoreCase属性使用详解
2015/06/16 Javascript
js实现有过渡渐变效果的图片轮播相册(兼容IE,ff)
2016/01/19 Javascript
jQuery根据表单name获取值的方法
2016/05/24 Javascript
JavaScript判断是否是微信浏览器
2016/06/13 Javascript
Javascript将JSON日期格式化
2016/08/23 Javascript
纯JS实现表单验证实例
2016/12/24 Javascript
js 性能优化之算法和流程控制
2017/02/15 Javascript
vue中如何引入jQuery和Bootstrap
2017/04/10 jQuery
Node.js开发第三方微信公众平台
2017/06/05 Javascript
JavaScript操作文件_动力节点Java学院整理
2017/06/30 Javascript
移动前端图片压缩上传的实例
2017/12/06 Javascript
JavaScript折半查找(二分查找)算法原理与实现方法示例
2018/08/06 Javascript
JavaScript实现构造json数组的方法分析
2018/08/17 Javascript
解决Vue中引入swiper,在数据渲染的时候,发生不滑动的问题
2018/09/27 Javascript
Vue自定义指令上报Google Analytics事件统计的方法
2019/02/25 Javascript
关于JavaScript 数组你应该知道的事情(推荐)
2019/04/10 Javascript
LayUI数据接口返回实体封装的例子
2019/09/12 Javascript
Vue-Ant Design Vue-普通及自定义校验实例
2020/10/24 Javascript
Python语言检测模块langid和langdetect的使用实例
2019/02/19 Python
选择python进行数据分析的理由和优势
2019/06/25 Python
Python 取numpy数组的某几行某几列方法
2019/10/24 Python
python 如何停止一个死循环的线程
2020/11/24 Python
CSS3 制作旋转的大风车(充满童年回忆)
2013/01/30 HTML / CSS
台湾百利市购物中心:e-Payless
2017/08/16 全球购物
以思科路由器为例你写下单臂路由的配置命令
2013/08/03 面试题
税务干部鉴定材料
2014/02/11 职场文书
离婚协议书样本
2015/01/26 职场文书
MySQL外键约束(FOREIGN KEY)案例讲解
2021/08/23 MySQL
Python绘制散点图之可视化神器pyecharts
2022/07/07 Python
Python创建SQL数据库流程逐步讲解
2022/09/23 Python