Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I parse URL params after a hash with Angularjs?

Tags:

I'm trying to parse for the access_token from Foursquare where the URL is like this:

https://mywebsite.com/4sqredirect/#access_token=1234567890XXXXX

I've tried $routeParams and $location and get nothing returned. Only after I tried $route, I did get an object back with the following attribute in it:

current:  { 
    params:  {  } 
    pathParams:  {  } 
    loadedTemplateUrl: partials/4sqredirect
    locals:  {  } 
    scope:  { 
        this:  { 
            $ref: $["current"]["scope"]
        } 
        route:  { 
            $ref: $
        } 
        location:  {  } 
        token: null
    }
} 

Does this mean there's no way to get it using native AngularJS functions cause of the hash?

UPDATE:

my controller looks like as follows:

angular.module('myApp')
    .controller('4sqredirectCtrl', function ($scope, $route, $location, $routeParams) {
        $scope.route = $route;
        $scope.location = $location;
        $scope.token = $routeParams.access_token;
    });

my main js looks like as follows:

angular.module('myApp', [
    'ngCookies',
    'ngResource',
    'ngSanitize',
    'ngRoute'
])
.config(function ($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true);

    $routeProvider
    .when('/', {
        templateUrl: 'partials/main',
        controller: 'MainCtrl'
    })
    .when('/4sqredirect/', {
        templateUrl: 'partials/4sqredirect',
        controller: '4sqredirectCtrl'
    })
    .otherwise({
        redirectTo: '/'
    });
});
like image 832
padawanlvn Avatar asked Jan 02 '14 07:01

padawanlvn


People also ask

How do you access parameters in AngularJS?

To use params simply append them like this: $routeProvider. when('/view1/:param1/:param2', { templateUrl: 'partials/partial1. html', controller: 'MyCtrl1' });

What is hash parameter in URL?

The hash property of the URL interface is a string containing a '#' followed by the fragment identifier of the URL. The fragment is not percent-decoded. If the URL does not have a fragment identifier, this property contains an empty string — "" .

What is$ location in AngularJS?

The $location in AngularJS basically uses a window. location service. The $location is used to read or change the URL in the browser and it is used to reflect that URL on our page. Any change made in the URL is stored in the $location service in AngularJS.


2 Answers

From angular location service $location.hash() method return #after-hash

so if your url is look like

https://mywebsite.com/4sqredirect/#access_token=1234567890XXXXX 

then

$location.hash() return access_token=1234567890XXXXX

you need to split it split('=')[1]

see this plunker when you click 4Square then $location.url() return

/4sqredirect/#access_token=123456 $location.hash().split('=')[1] 

return 123456

like image 176
Tasnim Reza Avatar answered Oct 11 '22 03:10

Tasnim Reza


Use $location.search()

//e.g. url https://www.example.com/#!?name=123
var s = $location.search();
// {name: '123'}

http://docs.angularjs.org/api/ng.$location

Search:

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

like image 32
Umur Kontacı Avatar answered Oct 11 '22 03:10

Umur Kontacı