Menu
I'm building a basic AngularJS Login page and the $window.location.href did not re-direct the page to a new html in my system, hosted by WAMP. I even tried re-directing it to google. Nothing happens. I tried all the available solutions here and nothing seems to work. Any solutions ?
JS followed by 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 == "[email protected]") {
alert("Login Successful");
$window.location.href = "http://google.com"; //Re-direction to some page
} else if (user != "[email protected]") {
alert("Invalid username");
} else if (pass != "admin" && user == "[email protected]") {
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>
963
The window. location. href property returns the URL of the current page.
To change path URL with AngularJS, $location. path() is passed the new URL as a parameter, and the page is automatically reloaded.
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.
In angular js you can use $location. Inject it in your 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 path() method for relative url :
$location.path('home'); // will redirect you to 'yourDomain.xx/home'
https://docs.angularjs.org/api/ng/service/$location
109
It is worth noting the current documentation for $location. Specifically the quote:
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.
What does it not do?
It does not cause a full page reload when the browser URL is changed. 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, $window.location is definitely recommended.
28
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
