In MVC angularJS application, how can I redirect to MVC page.
I tried below two options
First
// It doesn't work
$location.path("/MyPage1");
Second
//It works
window.location = "/MyPage1";
Please suggest best way to redirect and why ?
REMEMBER : I am not using angularJs Routing.
Comparing $location to window.location official doc clearly stated
see the section at this location
seamless integration with HTML5 API
window.location: no
$location: yes (with a fallback for legacy browsers)
and more
Both do have their own merits. They are clearly described in the official docs as mentioned by #Mohammad. So depending on the circumstances choose any of the either :
Use $location : When you do not require a full page reload when the browser URL is changed, wants to avail the angular internal life-cycle benefits and where you don't need to support old legacy browsers.This might be useful if your destination is just a variation on the current URL, so that you can take advantage of $location helper methods. E.g. we ran $location.search(..., ...) to just change value of a querystring paramater.
Use native window location : 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 or when you want to work with row level object properties that you can directly modified. i.e like Force reload window.location.reload().
Related
For WebExtensions, there are several methods to check a page's URL:
window.location.href in a content script,
the webRequest API, and
tabs.onUpdated.
Which one to use when you just need to check the URL, and maybe redirect based on it? Which is easiest to code? Are there reasons for using the others?
For your specific use case use the best method is
window.location.href
if you want to get only domain name instead of full URL, use
window.location.hostname
For complete guide on Window Location API please check https://developer.mozilla.org/en-US/docs/Web/API/Window/location
Note: You mentioned document.location.href which is not supported on some version of Firefox browser
Is it possible to remove parameter from query-string with js, I have tried below one unfortunately its works in browser console not in JS file.
var clean_uri = location.protocol + "//" + location.host+location.pathname;
window.history.replaceState({}, document.title, clean_uri);
what would be the best way to do it.
The reason this would only work in the browser is that the window.history API is only available in your browser. I'm not quite sure what you mean by 'from file'. But as one of the commenters pointed out the problem is in the context of where it is executed. If for instance you are executing this in a Node environment rather than a browser, there is no window.history api. Node doesn't even have a window object.
Since you've added an AngularJs flag, it might be that the routing inside the app is listening to changes to the URL and will act on them. Angular may have it's own way of allowing you to change the URL but I'm not familiar enough to help with that.
I often need to interact with my page's DOM, how can I do it via WebSharper?
For instance when I want to redirect my page in just JavaScript I'd run:
window.location = "http://www.google.com/";
How can I access window and set location? how would this look in F#?
Also, how would it work with functions, for instance with IE's:
window.navigate("http://www.google.com/")
Note: If there is a built-in way to redirect via WebSharper I'd love to know it but keep in mind this is just an example.
You can access the window.location property after opening the IntelliFactory.WebSharper.Html5 namespace which provides support for the standard HTML5 APIs. In order to navigate using the location object you can call the assign or replace methods:
Window.Self.Location.Assign "http://www.google.com/"
A live demo is available here.
For vendor specific functions you can inline the JavaScript and use it as if it was built into WebSharper:
[<Inline "window.navigate($uri)">]
let ieNavigate uri = X<unit>
Chrome Packaged Apps have a rather strict Content Security Policy. One result of this is that manipulating the location (like clicking on a link) results in:
'Can't open same-window link to "chrome-extension://lkjasdfjklbdskjasdfjkhfdshjksad/derp.html"; try target="_blank". '
Target _blank will open the link in chrome which is not what I want. Can AngularJS' routing work in such a locked-down environment?
They docs give an example of an Angular app, but conspicuously does not use routing.
Update
Here is the link that, when clicked, gives the error: <a class='walrus-link' ng-href='paystubs/{{walrus.id}}'>Walrus {{id}}!</a>
Instead of using an href, try using ng-click and call a method to your controller the relocates to the appropriate page using $location. See the documentation on the AngularJS site. The following quote from the doc gives an indication that the $location service might be appropriate for you:
When should I use $location? Any time your application needs to react
to a change in the current URL or if you want to change the current
URL in the browser.
Your code might look something like this:
<a class='walrus-link' ng-click='getPaystub(walrus.id)'>Walrus {{id}}!</a>
and in your parent controller, you'll need a scope method called 'getPaystub' with a line similar to:
$scope.getPaystub = function(selectedWalrusId) {
$location.path('paystubs/'+$scope.walrus.id);
}
This way angular keeps control and won't cause a page refresh. This hopefully keeps you within the bounds of the CSP. Unfortunately I cannot test this in a packaged app, but I've used the exact same convention in a web app and it works just dandy.
routing works for me in my chrome app when not using $routeProvider's html5 mode (which is disabled by default), you just have to use a hash in the url.
so my links look like this:
About
$routeProvider configuration is as follows:
$routeProvider.when('/about', {templateUrl:'about.html'})
Basically, i want to make Firefox obey "Warn me when web sites try to redirect or reload the page" user preference. Currently, this is really open sesame for any kind of doorway writers etc.
Please find the detailed description of this misbehaviour in related superuser post.
You can use Object.watch() to intercept changes of some properties like window.location:
function onLocationChange(id, oldval, newval)
{
if (confirm("Do you want to navigate to " + newval + "?"))
return newval;
else
return oldval;
}
wnd.watch("location", onLocationChange);
wnd.document.watch("location", onLocationChange);
wnd.location.watch("href", onLocationChange);
You would have to similarly intercept assignments to other window.location properties like host or pathname. The big disadvantage of this approach: there can be only one watcher. If the page installs its own watcher or simply calls wnd.unwatch("location") all your detection will be gone.
How to get to the window before any page JavaScript has a chance to run depends on whether you are using the Add-on SDK or whether you have a classic add-on. If you are using the Add-on SDK then you use the page-mod module with contentScriptWhen parameter set to start. In the code example above you replace wnd by unsafeWindow (the window has to be accessed directly, otherwise it won't work).
In a classic add-on you register an observer for the content-document-global-created notification. Here you also have to access the window directly:
var wnd = XPCNativeWrapper.unwrap(subject);
See documentation on XPCNativeWrapper.unwrap().
A "JavaScript-driven redirect" would be done by using the window.location property. All you would need to do is replace that property's setter function as soon as the page loads.
Here is a John Resig blog post on defining setters and getters for properties. http://ejohn.org/blog/javascript-getters-and-setters/
I wasn't able to override the default window.location setter using client side js, but it may be possible using a more privileged extension environment though.