Geek Answers Handbook

$ window.location.href DOES NOT WORK in AngularJS

I create the base page of AngularJS and $ window.location.href did not redirect the page to the new html on my system, placed it on WAMP. I even tried redirecting it to Google. Nothing has happened. I tried all available solutions here and nothing works. Any solutions?

JS then HTML

var app = angular.module('myApp', []); app.controller('MainCtrl', function($scope) { $scope.name = 'World'; $scope.submit = function() { if ($scope.username && $scope.password) { var user = $scope.username; var pass = $scope.password; if (pass == "admin" && user == " admin@admin.com ") { alert("Login Successful"); $window.location.href = "http://google.com"; //Re-direction to some page } else if (user != " admin@admin.com ") { alert("Invalid username"); } else if (pass != "admin" && user == " admin@admin.com ") { alert("Invalid password"); } } else { alert("Invalid Login"); } } }); 
 <!DOCTYPE html> <html ng-app="myApp"> <head> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <script src="login.js"></script> <link rel="stylesheet" href="login.css"> </head> <body ng-controller="MainCtrl"> <form> <label>Username:</label> <input type="email" ng-model="username" class="lab1" /> </br> </br> <label></label>Password:</label> <input type="password" ng-model="password" class="lab2"> </br> <button type="submit" ng-click="submit()" class="buttonclass">login</button> </form> </body> </html>
+6
source share
6 answers

In angular js, you can use $location . Add it to the controller:

 app.controller('MainCtrl', function($scope, $location) { ... }

And if you want to redirect to google, use its url() method:

 $location.url('http://google.fr');

you can also use the path() method for relative URL:

 $location.path('home'); // will redirect you to 'yourDomain.xx/home'

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

+2
source

It is worth noting the current documentation for $location . In particular, the quote:

When should you use $ location?

Every time your application needs to respond to a change in the current URL or if you want to change the current URL in the browser.

What does he not do?

This does not completely reload the page when the browser URL changes. To reload the page after changing the URL, use the lower-level API, $ window.location.href.

If you need to redirect the browser to a new page, it is recommended to specify $ window.location.

+3
source 
 Try this, var homeApp = angular.module('HomeApp', []); homeApp.controller('HomeController', function ($scope, $http, $window) { $scope.loginname = "Login To Demo App"; $scope.login = function () { var name = $scope.username; var pwd = $scope.password; var req = { method: 'POST', url: '../Account/LoginAccount', headers: { 'Content-Type': undefined }, params: { username: name, password: pwd } } $http(req).then(function (responce) { var url = ''; if (responce.data == "True") { url = '../Account/WelcomePage'; $window.location.href = url; } else { url = '../Account/Login'; $window.location.href = url; } }, function (responce) { }); } });
+1
source

Angular has its own location handler called $location , which I prefer to use in an angular application;

 app.controller('MainCtrl', function($scope, $location) {

enter your controller and use the following:

 $location.path('http://foo.bar')
0
source

You can use $window.location.href in AngularJS

 app.controller('MainCtrl', function ($scope,$window) { $scope.formData = {}; $scope.submitForm = function (formData){ $window.location.href = "jobs"; }; })
0
source

My two cents -

I could not get $window.location.href or $location.path to work from the page. The documentation for $location (with reservations ) says:

The $ location service allows you to change only the URL; it does not allow reloading the page. When you need to change the URL and reload the page or go to another page, use the lower-level API, $ window.location.href.

$ location Cautions

There is no documentation for $ window. Despite this, none of the services worked for me in the controller (although $ location.path works in my index.run file).

In this project, I am using ui-router, so it worked: $state.go('state.name'); - where state.name is the string of the name of the state / page to which the user wants to go, i.e. 'index.users'

0
source

More articles:


All Articles