发表新帖
发表新帖

Getting values from query string in an url using AngularJS $location

后端 未结
关注
9 890
鱼传尺愫
鱼传尺愫 2020-11-27 04:36

Regarding $location.search, the docs say,

Return search part (as object) of current url when called without any parameter.

In my

相关标签:
9条回答
  • 长情又很酷
    2020-11-27 05:19

    In my NodeJS example, I have an url "localhost:8080/Lists/list1.html?x1=y" that I want to traverse and acquire values.

    In order to work with $location.search() to get x1=y, I have done a few things

    1. script source to angular-route.js
    2. Inject 'ngRoute' into your app module's dependencies
    3. Config your locationProvider
    4. Add the base tag for $location (if you don't, your search().x1 would return nothing or undefined. Or if the base tag has the wrong info, your browser would not be able to find your files inside script src that your .html needs. Always open page's view source to test your file locations!)
    5. invoke the location service (search())

    my list1.js has

        var app = angular.module('NGApp', ['ngRoute']);  //dependencies : ngRoute
    app.config(function ($locationProvider) { //config your locationProvider
         $locationProvider.html5Mode(true).hashPrefix('');
    });

    app.controller('NGCtrl', function ($scope, datasvc, $location) {// inject your location service
        //var val = window.location.href.toString().split('=')[1];
        var val = $location.search().x1;    alert(val);
        $scope.xout = function () {
           datasvc.out(val)
           .then(function (data) {
              $scope.x1 = val;
              $scope.allMyStuffs = data.all;
           });
        };
        $scope.xout();
    });

    and my list1.html has

    <head>
    <base href=".">
    </head>
<body ng-controller="NGCtrl">
<div>A<input ng-model="x1"/><br/><textarea ng-model="allMyStuffs"/></div>
<script src="../js/jquery-2.1.4.min.js"></script>
<script src="../js/jquery-ui.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular-route.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="../js/ui-bootstrap-tpls-0.14.3.min.js"></script>
<script src="list1.js"></script>
</body>

    Guide: https://code.angularjs.org/1.2.23/docs/guide/$location

    0 讨论(0)
  • 死守一世寂寞
    2020-11-27 05:20

    If you just need to look at the query string as text, you can use: $window.location.search

    0 讨论(0)
  • 一向
    2020-11-27 05:20

    If your $location.search() is not working, then make sure you have the following:

    1) html5Mode(true) is configured in app's module config

    appModule.config(['$locationProvider', function($locationProvider) {
   $locationProvider.html5Mode(true);
}]);

    2) <base href="/"> is present in your HTML

    <head>
  <base href="/">
  ...
</head>

    References:

    1. base href="/"
    2. html5Mode
    0 讨论(0)
 看不清?
提交回复
热议问题