Angular - getting GET variable using $location

Question

I'm tring to get a GET var from the url using Angular $location.search() but it didn't work.

This is the code:

and this is the GET

var app = angular.module('myApp',[]);

app.controller('odinvite', function ($scope, $location)
    {
        //$scope.mytry = 5;
        $scope.mytry =$location.search().username;
    }
);

What's the problem? There is other way besides?

thanks!

EDIT -
I tried to add manually hash to the url like this - "mydomain.com/foo.php#?username=7" and it worked! But I don't to add hash every time and I want the $location to grab it automatically.

I also tried to add this -

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

to solve it but it gave me an error -

Error: [$location:nobase] http://errors.angularjs.org/1.4.8/$location/nobase
    at angular.js:38
    at hf.$get (angular.js:12196)
    at Object.e [as invoke] (angular.js:4523)
    at angular.js:4340
    at d (angular.js:4482)
    at Object.e [as invoke] (angular.js:4514)
    at M.instance (angular.js:9182)
    at D (angular.js:8299)
    at g (angular.js:7731)
    at angular.js:7611
(anonymous) @ angular.js:12520
(anonymous) @ angular.js:9292
$apply @ angular.js:16157
(anonymous) @ angular.js:1679
e @ angular.js:4523
c @ angular.js:1677
yc @ angular.js:1697
Zd @ angular.js:1591
(anonymous) @ angular.js:29013
b @ angular.js:3057
If @ angular.js:3346
d @ angular.js:3334

Sravan · Accepted Answer · 2017-03-29 13:03:10Z

1

Your example is working with the second link. It will not work with the first link because the fiddle link https://jsfiddle.net/bar2o6gf/3/ does not contain a username

so, I mocked the url using,'url' property of $location

$location.url('http://fiddle.jshell.net/bar2o6gf/3/show/light/?username=7');

Here is the code,

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
  <head>
    <script src="script.js"></script>
  </head>

  <body>
    <div ng-app="myApp" ng-controller="odinvite">
      <div>
        <br />
        <br />

      $location.url() = {{location.url()}}<br />
      $location.search() = {{loc1}}<br />
      keyword valus is  {{mytry}}
  </div>
  {{mytry}}
    </div>
  
<script>
var app = angular.module('myApp',[]);

app.controller('odinvite', function ($scope, $location)
    {
        //$scope.mytry = 5;
        
        $scope.location = $location;
      $location.url('http://fiddle.jshell.net/bar2o6gf/3/show/light/?username=7');
  $scope.loc1 = $location.search() ;    
    if($location.url().indexOf('username') > -1){    
        $scope.mytry= $location.search().username ;    
               
    }
  
    }
);

</script>

</body>
</html>

Here is a DEMO

edited Mar 29, 2017 at 13:03

answered Mar 29, 2017 at 12:10

Sravan

18.7k3 gold badges33 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

13 Comments

J. Doe Over a year ago

I tried it on my WAMP server before and it didn't work.

J. Doe Over a year ago

codeshare.io/2BdlQL - this is the code right now... I shrink it for better debugging

Sravan Over a year ago

Just console.log($location.search()) and check what you are getting. also check this plnkr.co/edit/Aa2XRXvEjIUerW6lyhun?p=preview

J. Doe Over a year ago

print "Object {}"

J. Doe Over a year ago

BTW - I just read somewhere about the hash - and when I do this - localhost/odinvite.php#?username=7 - It works!

|

Community · Accepted Answer · 2017-05-23 12:17:31Z

0

This is an issue with JS Fiddle and the way query string properties work with iFrames. See here: How to pass GET parameters to jsFiddle

edited May 23, 2017 at 12:17

CommunityBot

11 silver badge

answered Mar 29, 2017 at 12:49

Joshua J Wilborn

5463 silver badges13 bronze badges

1 Comment

J. Doe Over a year ago

I tried it on my WAMP server. It didn't work there either

Collectives™ on Stack Overflow

Angular - getting GET variable using $location

2 Answers 2

13 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

13 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related