$window.location.href 在 AngularJS 中不起作用
Posted
技术标签:
【中文标题】$window.location.href 在 AngularJS 中不起作用【英文标题】：$window.location.href NOT WORKING in AngularJS 【发布时间】：2016-03-05 05:28:38 【问题描述】：我正在构建一个基本的 AngularJS 登录页面，并且 $window.location.href 没有将页面重定向到我系统中托管的新 html通过 WAMP。我什至尝试将其重新定向到谷歌。什么都没发生。我在这里尝试了所有可用的解决方案，但似乎没有任何效果。有什么解决办法吗？ JS 后跟 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>【问题讨论】：
尝试不带$ 符号。 window.location.href = "admin@admin.com"
使用基本的 javascript 窗口重定向 .. 没有 $。 window.location.href.
成功了。谢谢 :) 但为什么它不适用于美元符号？
@VarunKN 检查这个link。
【参考方案1】：
在 Angular js 中，您可以使用 $location。将其注入您的控制器：
app.controller('MainCtrl', function($scope, $location) ...
如果你想重定向到谷歌使用它的url() 方法：
$location.url('http://google.fr');
您也可以使用path() 方法获取相对网址：
$location.path('home'); // will redirect you to 'yourDomain.xx/home'
https://docs.angularjs.org/api/ng/service/$location
【讨论】：
错误。您不必“必须使用”；您可以使用。 $location 不是强制性的，因为它是一项服务。根据情况，您可以毫无问题地使用 window.location。 见 Jim Grimmett 的回答。它似乎更准确。【参考方案2】：值得注意的是current documentation 对应于$location。具体引用：
我应该什么时候使用 $location？
任何时候您的应用程序需要对当前 URL 的更改或您想要更改浏览器中的当前 URL 做出反应。
它不能做什么？
更改浏览器 URL 时不会导致整个页面重新加载。要在更改 URL 后重新加载页面，请使用较低级别的 API，$window.location.href。
如果需要将浏览器重定向到新页面，绝对推荐使用 $window.location。
【讨论】：
【参考方案3】：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)
);
);
【讨论】：
可能你的代码不工作，因为你没有在控制器参数中声明$window【参考方案4】：你可以在 AngularJS 中使用$window.location.href
app.controller('MainCtrl', function ($scope,$window)
$scope.formData = ;
$scope.submitForm = function (formData)
$window.location.href = "jobs";
;
)
【讨论】：
【参考方案5】：Angular 有自己的位置处理程序，名为 $location，我更喜欢在 Angular 应用程序中使用它；
app.controller('MainCtrl', function($scope, $location)
注入您的控制器并使用如下；
$location.path('http://foo.bar')
【讨论】：
【参考方案6】：我的两分钱 -
我无法让$window.location.href 或$location.path 工作以离开页面。在 $location 的文档中（在 caveats 下）它说：
$location 服务只允许您更改 URL；它不允许您重新加载页面。当您需要更改 URL 并重新加载页面或导航到不同的页面时，请使用较低级别的 API，$window.location.href。
$location Caveats
$window 的文档...缺少。无论如何，这两项服务在控制器中都不适合我（尽管 $location.path 在我的index.run 文件中有效）。
在这个项目中，我使用的是 ui-router，所以这样做很有效：
$state.go('state.name'); -- 其中 state.name 是用户想要去的状态/页面名称的字符串，即'index.users'
【讨论】：
以上是关于$window.location.href 在 AngularJS 中不起作用的主要内容，如果未能解决你的问题，请参考以下文章
window.location.href/replace/reload()/页面跳转+替换+刷新
window.location.href 和 window.open 跳转的区别
javascript中window.open()与window.location.href的区别