如何使用 AngularJS 重定向到另一个页面？

我使用 ajax 调用在服务文件中执行功能，如果响应成功，我想将页面重定向到另一个 URL。目前，我正在通过普通的 JS 代码 window.location = response['message'];来完成这项工作。但我需要用 AngularJS 代码替换它。我已经查看了关于堆栈溢出的各种解决方案，它们使用的是 $location。但我是新的 AngularJS 和有麻烦实施它。

$http({
url: RootURL+'app-code/common.service.php',
method: "POST",
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
dataType: 'json',
data:data + '&method=signin'


}).success(function (response) {


console.log(response);


if (response['code'] == '420') {


$scope.message = response['message'];
$scope.loginPassword = '';
}
else if (response['code'] != '200'){


$scope.message = response['message'];
$scope.loginPassword = '';
}
else {
window.location = response['message'];
}
//  $scope.users = data.users;    // assign  $scope.persons here as promise is resolved here
})
483730 次浏览
小开
最佳答案

你可以使用角度 $window:

$window.location.href = '/index.html';

控制器中的使用示例:

(function () {
'use strict';


angular
.module('app')
.controller('LoginCtrl', LoginCtrl);


LoginCtrl.$inject = ['$window', 'loginSrv', 'notify'];


function LoginCtrl($window, loginSrv, notify) {
/* jshint validthis:true */
var vm = this;
vm.validateUser = function () {
loginSrv.validateLogin(vm.username, vm.password).then(function (data) {
if (data.isValidUser) {
$window.location.href = '/index.html';
}
else
alert('Login incorrect');
});
}
}
})();
小开

也许能帮到你！

AngularJ 代码示例

var app = angular.module('app', ['ui.router']);


app.config(function($stateProvider, $urlRouterProvider) {


// For any unmatched url, send to /index
$urlRouterProvider.otherwise("/login");


$stateProvider
.state('login', {
url: "/login",
templateUrl: "login.html",
controller: "LoginCheckController"
})
.state('SuccessPage', {
url: "/SuccessPage",
templateUrl: "SuccessPage.html",
//controller: "LoginCheckController"
});
});


app.controller('LoginCheckController', ['$scope', '$location', LoginCheckController]);


function LoginCheckController($scope, $location) {


$scope.users = [{
UserName: 'chandra',
Password: 'hello'
}, {
UserName: 'Harish',
Password: 'hi'
}, {
UserName: 'Chinthu',
Password: 'hi'
}];


$scope.LoginCheck = function() {
$location.path("SuccessPage");
};


$scope.go = function(path) {
$location.path("/SuccessPage");
};
}
小开

您可以通过不同的方式重定向到新的 URL。

  1. 您可以使用 $窗户，它也将刷新页面
  2. 你可以“留在”单页应用程序和使用 $位置在这种情况下，你可以选择 $location.path(YOUR_URL);或 $location.url(YOUR_URL);。因此，这两种方法的基本区别在于，$location.url()也会影响获取参数，而 $location.path()不会。

我建议你阅读关于 $location和 $window的文档，这样你就能更好地理解它们之间的区别。

小开

$location.path('/configuration/streaming'); 这会成功的。 在控制器中注入定位服务

小开

我使用下面的代码重定向到新页面

$window.location.href = '/foldername/page.html';

并在我的控制器函数中注入 $window 对象。

小开 
 (function () {
"use strict";
angular.module("myApp")
.controller("LoginCtrl", LoginCtrl);


function LoginCtrl($scope, $log, loginSrv, notify) {


$scope.validateUser = function () {
loginSrv.validateLogin($scope.username, $scope.password)
.then(function (data) {
if (data.isValidUser) {
window.location.href = '/index.html';
}
else {
$log.error("error handler message");
}
})
}
} }());
小开

我用的简单方法是

app.controller("Back2Square1Controller", function($scope, $location) {
window.location.assign(basePath + "/index.html");
});
小开

这样做的一个好方法是使用 $state.go (‘ statename’，{ params... }) ，在不需要重新加载和引导整个应用配置和其他东西的情况下，它对用户体验更快、更友好

(function() {
'use strict';


angular
.module('app.appcode')
.controller('YourController', YourController);


YourController.$inject = ['rootURL', '$scope', '$state', '$http'];


function YourController(rootURL, $scope, $state, $http) {


$http({
url: rootURL + 'app-code/common.service.php',
method: "POST",
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
dataType: 'json',
data:data + '&method=signin'


}).success(function (response) {
if (response['code'] == '420') {


$scope.message = response['message'];
$scope.loginPassword = '';
} else if (response['code'] != '200') {


$scope.message = response['message'];
$scope.loginPassword = '';
} else {
// $state.go('home'); // select here the route that you want to redirect
$state.go(response['state']); // response['state'] should be a route on your app.routes
}
})
}


});

//路线

(function() {
'use strict';


angular
.module('app')
.config(routes);


routes.$inject = [
'$stateProvider',
'$urlRouterProvider'
];


function routes($stateProvider, $urlRouterProvider) {
/**
* Default path for any unmatched url
*/
$urlRouterProvider.otherwise('/');


$stateProvider
.state('home', {
url: '/',
templateUrl: '/app/home/home.html',
controller: 'Home'
})
.state('login', {
url: '/login',
templateUrl: '/app/login/login.html',
controller: 'YourController'
})
// ... more routes .state
}


})();
小开

如果你想使用一个链接，然后: 在 html 有:

<button type="button" id="btnOpenLine" class="btn btn-default btn-sm" ng-click="orderMaster.openLineItems()">Order Line Items</button>

在打印脚本文件中

public openLineItems() {
if (this.$stateParams.id == 0) {
this.Flash.create('warning', "Need to save order!", 3000);
return
}
this.$window.open('#/orderLineitems/' + this.$stateParams.id);

}

我希望您能看到这个例子和其他答案一样对我有帮助。

小开

我面临的问题，在重定向到一个有棱角的应用程序的不同页面以及

你可以添加的 $window作为爱华德在他的答案建议，或者如果你不想添加的 $window，只要添加一个超时，它将工作！

setTimeout(function () {
window.location.href = "http://whereeveryouwant.com";
}, 500);
小开

在 AngularJS 中，你可以通过使用如下 window.location.href='';将 改变你的方向(提交)转到其他页面:

postData(email){
if (email=='undefined') {
this.Utils.showToast('Invalid Email');
} else {
var origin = 'Dubai';
this.download.postEmail(email, origin).then(data => {
...
});
window.location.href = "https://www.thesoftdesign.com/";
}
}

试试这个:

window.location.href = "https://www.thesoftdesign.com/";
小开

吸毒 location.href="./index.html"

或者创造 scope $window

和使用 $window.location.href="./index.html"


提交答案