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

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中携带参数的获取方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • Angularjs中$http以post请求通过消息体传递参数的实现方法

    本文实例讲述了Angularjs中$http以post请求通过消息体传递参数的方法.分享给大家供大家参考,具体如下: Angularjs中,$http以post在消息体中传递参数,需要做以下修改,以确保消息体传递参数的正确性. 一.在声明应用的时候进行设置: var httpPost = function($httpProvider) { /******************************************* 说明:$http的post提交时,纠正消息体 ***********

  • 详解angular中通过$location获取路径(参数)的写法

    我最近在研究angular中通过$location获取路径(参数)的写法,在网上搜索了很多的资料,正好今天有时间,就整理一下! 以下获取与修改的 URL 以  ( http://172.16.0.88:8100/#/homePage?id=10&a=100  ) 为例 [一]获取 (不修改URL) //获取当前完整的url路径 var absurl = $locationabsUrl(); //http://88:8100/#/homePage?id=10&a=100 // 获取当前url

  • AngularJS下$http服务Post方法传递json参数的实例

    本文主要介绍如何使用Angularjs $http服务以POST方法向服务器传递json对象数据. 具体如下: 一.$http POST方法默认提交数据的类型为application/json var data = {'wid':'0', 'praise' : '25'}; $http.post(url, data).success(function(result) { // }); 最终发送的请求是: POST http://www.example.com HTTP/1.1 Content-T

  • AngularJS页面带参跳转及参数解析操作示例

    本文实例讲述了AngularJS页面带参跳转及参数解析操作.分享给大家供大家参考,具体如下: 页面带参跳转 $scope.LoginSucessLocation = function () { var hre = 'http://ctb.qingguo.com/weixinCt/main#/upload_topic_start?uid=' + $scope.uid + '&orgcode=' + $scope.orgCode; location.href = hre; } 在url的后面,增加?

  • AngularJS $http post 传递参数数据的方法

    在cordova开发的时候使用到了$http的post方法,传递的参数服务端怎么都接收不到,搜索了下,发现使用AngularJS通过POST传递参数还是需要设置一些东西才可以! 1.不能直接使用params 例如: $http({ method: "POST", url: "http://192.168.2.2:8080/setId", params: { cellphoneId: "b373fed6be325f7"} }).success();

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

    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.

  • 使用JavaScript获取URL中的参数(两种方法)

    本文给大家分享两种方法使用js获取url中的参数,其中方法二是使用的正则表达式方法,大家可以根据需要选择比较好的方法,废话不多说了,直接看详细介绍吧. 方法一: //取url参数 var type = request("type") function request() { var query = location.search; var paras = arguments[0]; if (arguments.length == 2) { query = arguments[1]; }

  • php解析url并得到url中的参数及获取url参数的四种方式

    下面一段代码是php解析url并得到url中的参数,代码如下所示: <?php $url = 'http://www.baidu.com/index.php?m=content&c=index&a=lists&catid=6&area=0&author=0&h=0&region=0&s=1&page=1'; $arr = parse_url($url); var_dump($arr); $arr_query = convertU

  • Vue项目获取url中的参数(亲测可用)

    目录 情况一:内部页面之间互相传值 情况二:外部跳转VUE项目时自带参数 1 获取?后面的参数 2 获取不带?的URL中的参数 亲测可用,若有疑问请私信 获取url参数有两种情况: 情况一:内部页面之间互相传值 这里先讲情况一,因为同一项目内互相传值比较简单,假如要从A页面跳转到B页面,并传值.就要在A页面这么写 this.$router.push({name:"B",query:{ Id : this.tId , ... }}) 进入B页面之后,在B页面内这么写 this.Id =

  • React 如何向url中添加参数

    React 如何向url中添加参数

    目录 React 向url中添加参数 React 获取url后面参数的值 React 向url中添加参数 用@withRouter修饰组件,把不是通过路由切换过来的组件中,将react-router 的 history.location.match 三个对象传入props对象上 使用queryString去序列化需要添加的参数: queryString.stringify({     name:liff,     id:1111 }) // return name=liff&id=1111 在p

  • spring boot中controller的使用及url参数的获取方法

    类上加上@RequestMapping其访问的地址就是类上的加上方法上的菜能访问到该方法,例如上图的地址就是/hello/say @RequestMapping(value = "/hello",method = RequestMethod.GET) 和@GetMapping(value = "/hello")是等同的 这样就能获取url参数的值了,其结果如下 总结 以上所述是小编给大家介绍的spring boot中controller的使用及url参数的获取方法,

  • 浅析JS获取url中的参数实例代码

    js获取url中的参数代码如下所示,代码简单易懂,附有注释,写的不好还请见谅! function UrlSearch() { var name, value; var str = location.href; //取得整个地址栏 var num = str.indexOf("?") str = str.substr(num + 1); //取得所有参数 stringvar.substr(start [, length ] var arr = str.split("&&

  • python 获取url中的参数列表实例

    Python的urlparse有对url的解析,从而获得url中的参数列表 import urlparse urldata = "http://en.wikipedia.org/w/api.php?action=query&ctitle=FA" result = urlparse.urlparse(urldata) print result print urlparse.parse_qs(result.query) 输出: ParseResult(scheme='http',

  • 浅谈SpringBoot处理url中的参数的注解

    1.介绍几种如何处理url中的参数的注解 @PathVaribale 获取url中的数据 @RequestParam 获取请求参数的值 @GetMapping 组合注解,是 @RequestMapping(method = RequestMethod.GET) 的缩写 (1)PathVaribale 获取url中的数据 看一个例子,如果我们需要获取Url=localhost:8080/hello/id中的id值,实现代码如下: @RestController public class Hello

  • 从URL中提取参数与将对象转换为URL查询参数的实现代码

    一.从URL中提取参数 有下列字符串: var linkURL = 'http://localhost:8080/String/string_6.html?昵称=小西山子&age=24#id1'; 对于一个真实的URL地址,可以用js来读取location中的相关信息来获得某些信息,下面列举一些: 复制代码 代码如下: location.origin : http://localhost[域] location.pathname : /project_js/Javascript/js_basic

随机推荐