hard refresh of browser page and then redirect to a url using javascript

Question

I am trying to reload the page and redirect it to another one, or just redirect it to another one but I can't do that by

window.location.href

or

windown.location

as I have an Angular Single Page app which catches the route and instead of reloading the page opens the partials directly

I did try -

window.location.reload(true)

but it reloads the page and cannot change the url I have also tried -

window.location.assign

and

window.location.replace

Is there any way to do this?

are you able to replicate this in a fiddle or plunk? http://plnkr.co/edit/5B6hH1Ro7CS4PmTDXTy4?p=preview ...you have to view it in a popped out window though... — deostroll, Apr 16 '15 at 09:59
I just achieved it by hit and trial. what I did was after changing the location by $window.location.href = url; which did not work for me previously and now also when used alone. I added the window.location.reload(true) in the next line so that the window is reloaded with the new url instead — Harshit Laddha, Apr 16 '15 at 11:07

Reena · Accepted Answer · 2015-04-16T07:02:43.827

There are three cases where AngularJS will perform a full page reload:

Links that contain target element

Example:

<a href="/ext/link?a=b" target="_self"> link  </a>

Absolute links that go to a different domain Example:

<a href="http://angularjs.org/">link</a>

Links starting with '/' that lead to a different base path when base is defined Example:

<a href="/not-my-base/link">link</a>

Updated:

Using javascript:

The $location service allows you to change only the URL; it does not allow you to reload the page. When you need to change the URL and reload the page or navigate to a different page, please use a lower level API: $window.location.href.

See:

https://docs.angularjs.org/guide/$location

https://docs.angularjs.org/api/ng/service/$location

this three ways are not angularjs specific, this is what about any html page :p — Pankaj Parkar, Apr 16 '15 at 07:01

score 2 · Answer 2 · answered Apr 16 '15 at 06:33

2

For redirect to different page you should use

$window.open('url', '_self')

Which will load your page again.

answered Apr 16 '15 at 06:33

Pankaj Parkar

134,766
23
234
299

It is not working, I have also tried var win = window.self win.open(url,"_self") – Harshit Laddha Apr 16 '15 at 06:45
I am calling this in a child scope does that have to do with anything? – Harshit Laddha Apr 16 '15 at 06:46
@deadman are you using modal window? why you don't think about bootstrap popup https://angular-ui.github.io/bootstrap/ – Pankaj Parkar Apr 16 '15 at 06:51

score 0 · Answer 3 · answered Apr 16 '15 at 06:31

0

try window.location = url;

do remember that the url must have a protocol i.e http:// or https://

answered Apr 16 '15 at 06:31

Adarsh Hegde

623
2
7
19

as I said in the question the window.location does not work and yes I did add http:// – Harshit Laddha Apr 16 '15 at 06:39
you can also try this. http://stackoverflow.com/questions/27941876/how-to-redirect-to-another-page-using-angular-js – Adarsh Hegde Apr 16 '15 at 06:44

score 0 · Answer 4 · answered Apr 16 '15 at 06:33

0

So you need to change the hash on the end of the URL? i.e. from #/ to #/otherpage/ ?

If so, location.hash = "/otherpage/";

answered Apr 16 '15 at 06:33

Collin Grady

2,226
1
14
14

No, any url changes they are captured by angular and it does not let the entire page refresh, just changes the view and controller. thats why window.location.reload(true) works for me and no other solution among the ones that I showed above but I want to change the url to in addition to the url change – Harshit Laddha Apr 16 '15 at 06:38

score 0 · Answer 5 · edited Jun 20 '20 at 09:12

According to https://docs.angularjs.org/guide/$location, if AngularJS is using HTML5 mode, it never performs a full page reload in a modern browser.

HTML5 mode

In HTML5 mode, the $location service getters and setters interact with the browser URL address through the HTML5 history API. This allows for use of regular URL path and search segments, instead of their hashbang equivalents. If the HTML5 History API is not supported by a browser, the $location service will fall back to using the hashbang URLs automatically. This frees you from having to worry about whether the browser displaying your app supports the history API or not; the $location service transparently uses the best available option.

Opening a regular URL in a legacy browser -> redirects to a hashbang URL Opening hashbang URL in a modern browser -> rewrites to a regular URL Note that in this mode, Angular intercepts all links (subject to the "Html link rewriting" rules below) and updates the url in a way that never performs a full page reload.

(Emphasis mine)

Since Hashbang mode is the default, the code must be setting HTML5 mode somewhere.

hard refresh of browser page and then redirect to a url using javascript

5 Answers5

HTML5 mode