angularJS1 url中携带参数的获取方法


Posted in Javascript onOctober 09, 2018

index.html 从此界面跳转到a.html界面

<!doctype html>
<html>

  <head>
    <meta charset="utf-8">
    <title>form demo</title>
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <script src="js/angular.min.1.6.0.js"></script>
  </head>

  <body ng-app="app" ng-controller="myctrl">

    <button ng-click="jump()" >点击跳转下一页</button>
    <br /><br />
    <a ng-href="a.html?name=xie&age=25&gender=nv" rel="external nofollow" >点击跳转下一页</a>
    </div>
  </body>

  <script>
    var app = angular.module('app', []);
    app.controller('myctrl', function($scope, $window) {
      $scope.jump = function() {
        $window.location.href = 'a.html?name=xie&age=25&gender=nv';
      }
    });
  </script>

</html>

a.html 跳转到的目标界面,在此界面获取url携带的参数:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <script src="js/angular.min.1.6.0.js"></script>
    <title></title>
  </head>
  <body ng-app="myapp" ng-controller="myctrl" >
    <p>a.html</p>


  </body>
  <script>
  //Url="http://168.33.222.69:8020/angularjs_demo/a.html?name=xie&age=25&gender=nv";
    var app=angular.module("myapp",[]);
    app.config(['$locationProvider', function($locationProvider) { 
     // $locationProvider.html5Mode(true); 
     $locationProvider.html5Mode({
     enabled: true,
     requireBase: false
    });
    }]);


    app.controller('myctrl', function($scope, $location) {


     console.log($location.search().name);
     console.log($location.search().age);
     console.log($location.search().gender);

    }); 

//打印结果:
//[Web浏览器] "xie" 
//[Web浏览器] "25" 
//[Web浏览器] "nv" 


  </script>
</html>

以上这篇angularJS1 url中携带参数的获取方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
采用call方式实现js继承
May 20 Javascript
Js获取图片原始宽高的实现代码
May 17 Javascript
基于jQuery.validate及Bootstrap的tooltip开发气泡样式的表单校验组件思路详解
Jul 18 Javascript
JS中解决谷歌浏览器记住密码输入框颜色改变功能
Feb 13 Javascript
vue实现百度搜索下拉提示功能实例
Jun 14 Javascript
解决vue组件中使用v-for出现告警问题及v for指令介绍
Nov 11 Javascript
微信小程序五子棋游戏的棋盘,重置,对弈实现方法【附demo源码下载】
Feb 20 Javascript
js 计算图片内点个数的示例代码
Apr 04 Javascript
Easyui 去除jquery-easui tab页div自带滚动条的方法
May 10 jQuery
Vue项目中使用better-scroll实现菜单映射功能方法
Sep 11 Javascript
javaScript把其它类型转换为Number类型
Oct 13 Javascript
JavaScript装饰者模式原理与用法实例详解
Mar 09 Javascript
AngularJS $http post 传递参数数据的方法
Oct 09 #Javascript
详解基于vue-cli3.0如何构建功能完善的前端架子
Oct 09 #Javascript
angularJS自定义directive之带参方法传递详解
Oct 09 #Javascript
Vue中的作用域CSS和CSS模块的区别
Oct 09 #Javascript
利用JS动态生成隔行换色HTML表格的两种方法
Oct 09 #Javascript
对angularJs中自定义指令replace的属性详解
Oct 09 #Javascript
基于vue2.0的活动倒计时组件countdown(附源码下载)
Oct 09 #Javascript
You might like
中国站长站 For Dede4.0 采集规则
2007/05/27 PHP
使用eAccelerator加密PHP程序
2008/10/03 PHP
如何阻止网站被恶意反向代理访问(防网站镜像)
2014/03/18 PHP
PHP程序员必须清楚的问题汇总
2014/12/18 PHP
PHP实现文件上传后台处理脚本
2020/03/04 PHP
JavaScript 入门基础知识 想学习js的朋友可以参考下
2009/12/26 Javascript
jQuery插件制作的实例教程
2016/05/16 Javascript
jQuery弹出下拉列表插件(实现kindeditor的@功能)
2016/08/16 Javascript
javascript实现鼠标点击页面 移动DIV
2016/12/02 Javascript
js倒计时小实例(多次定时)
2016/12/08 Javascript
ionic2打包android时gradle无法下载的解决方法
2017/04/05 Javascript
JS中IP地址与整数相互转换的实现代码
2017/04/10 Javascript
AngularJS表单验证功能
2017/10/19 Javascript
jquery学习笔记之无new构建详解
2017/12/07 jQuery
web前端vue filter 过滤器
2018/01/12 Javascript
使用react实现手机号的数据同步显示功能的示例代码
2018/04/03 Javascript
迅速了解一下ES10中Object.fromEntries的用法使用
2019/03/05 Javascript
vue-cli2与vue-cli3在一台电脑共存的实现方法
2019/09/25 Javascript
vue实践---根据不同环境,自动转换请求的url地址操作
2020/09/21 Javascript
Python利用正则表达式匹配并截取指定子串及去重的方法
2015/07/30 Python
举例讲解Python设计模式编程中的访问者与观察者模式
2016/01/26 Python
使用Django启动命令行及执行脚本的方法
2018/05/29 Python
使用Flask集成bootstrap的方法
2018/07/24 Python
tensorflow 实现从checkpoint中获取graph信息
2020/02/10 Python
python ffmpeg任意提取视频帧的方法
2020/02/21 Python
python pandas.DataFrame.loc函数使用详解
2020/03/26 Python
css 省略号 css3让多余的字符串消失并附加省略号的实现代码
2013/02/07 HTML / CSS
意大利折扣和优惠券网站:Groupalia
2019/10/09 全球购物
个人求职信范文分享
2013/12/13 职场文书
英语生日邀请函
2014/01/23 职场文书
安全责任书
2015/01/29 职场文书
党员考试作弊检讨书1000字
2015/02/16 职场文书
大学生旷课检讨书1000字
2015/02/19 职场文书
行政处罚告知书
2015/07/01 职场文书
2015年国庆放假通知范文
2015/08/18 职场文书
MySQL 数据类型详情
2021/11/11 MySQL