AngularJs $location.path with full url

Question

I want to route the user to an url if he clicks ok in a modal. In my controller i receive urls like

var newUrl = http://localhost:3000/#/dashboard

var newUrl = http://localhost:3000/#/users

as variable.

If i then use

$location.path(newUrl);

it does not work. I also tried

$location.url(newUrl);

but my URL gets encoded like this.

http://localhost:3000/#/#%2Fdashboard

Is there a way to get only the path of the url?

Edit

this code is part of a service. A user make some inputs in a form and clicks on another link for example in the menu. Then a popup appears where he is asked to skip his form changes. If he clicks yes i get the requested url. This is from my development environment on the server of course it will be another url. So i can not just use

$location.path("/users")

for example

Simply do: $location.path('/users') or newUrl = '/users' — Mik378
– Mik378, Commented Nov 30, 2013 at 17:09
I reported this issue: github.com/angular/angular.js/issues/8617 — JohnC
– JohnC, Commented Aug 14, 2014 at 21:54
stackoverflow.com/questions/21073815/… suggests that you use $window.location.href = newUrl — Jay Jay Jay
– Jay Jay Jay, Commented Jul 15, 2015 at 21:50

Zanon · Accepted Answer · 2016-04-16 20:52:40Z

22

I ran into this same problem when having Angular preventDefault $locationChangeStart events, force a save, and only redirect upon success. I define the following function in the body of the controller:

var baseLen = $location.absUrl().length - $location.url().length;
function getPath(fullUrl) { 
    return fullUrl.substring(baseLen);
}

It doesn't seem like a clean solution, but as a work around, it does the job. A RegEx might work better for you, if you don't know that your URLs are pointing to the same site.

edited Apr 16, 2016 at 20:52

Zanon

31k21 gold badges119 silver badges127 bronze badges

answered Jan 31, 2014 at 1:56

Robert Balicki

1,6312 gold badges18 silver badges24 bronze badges

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

Comments

Community · Accepted Answer · 2020-06-20 09:12:55Z

11

You can use $location.absUrl().

See the official documentation: enter link description here

This method is getter only.

Return full url representation with all segments encoded according to rules specified in RFC 3986.

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Oct 6, 2014 at 13:12

Xspirits

2172 silver badges7 bronze badges

1 Comment

Sebastian Over a year ago

As you say, absUrl is a getter and not a setter, so how does this answer the question?!

arjabbar · Accepted Answer · 2015-06-25 21:25:20Z

6

May I offer a different solution:

    $scope.$on('$locationChangeStart', function(e) {
      if (meetsTheRequirementsToLeave()) {
        return;
      }
      var newPath = $location.path();
      e.preventDefault();
      checkIfUserWantsToLeave().then(function() {
        $location.path(newPath);
      });
    });

Within this event $location.path() returns the new path.

answered Jun 25, 2015 at 21:25

arjabbar

6,4444 gold badges33 silver badges46 bronze badges

1 Comment

Vincent van der Weele Over a year ago

This is by far the cleanest solution +1

Collectives™ on Stack Overflow

AngularJs $location.path with full url

3 Answers 3

Comments

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related