AngularJS UI路由器:重定向到其他状态isn';t工作(网络::错误\u失败)
我正在使用AngularJS UI路由器:重定向到其他状态isn';t工作(网络::错误\u失败),angularjs,redirect,angular-ui-router,Angularjs,Redirect,Angular Ui Router,我正在使用AngularJS和UI路由器构建一个用于路由的应用程序。基本上,用户需要登录,根据逻辑,站点会将用户重定向到不同的视图 我的情况: 在提供用户名和密码后,我试图重定向到登录控制器中的另一个状态。但是,我总是收到一条net::ERR\u FAILED消息 我已经尝试了$state.go()和$location.path(),但两者都不起作用 我的问题: 我应该如何设置配置以使其工作 App.js中的代码 'use strict'; /** * @ngdoc overview
AngularJS
和UI路由器
构建一个用于路由的应用程序。基本上,用户需要登录,根据逻辑,站点会将用户重定向到不同的视图
我的情况:
在提供用户名
和密码
后,我试图重定向到登录控制器中的另一个状态。但是,我总是收到一条net::ERR\u FAILED
消息
我已经尝试了$state.go()
和$location.path()
,但两者都不起作用
我的问题:
我应该如何设置配置以使其工作
App.js中的代码
'use strict';
/**
* @ngdoc overview
* @name clientApp
* @description
* # clientApp
*
* Main module of the application.
*/
angular
.module('clientApp', [
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch',
'toaster',
'ngFileUpload',
'ui.router',
'ui.bootstrap'
])
.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider.state('site', {
'abstract': true,
views: {
'navi@': {
templateUrl: "views/navigation.html",
controller: 'NavigationCtrl',
controllerAs: 'navigation'
}
},
resolve: {
authorize: ['authorization',
function(authorization) {
return authorization.authorize();
}
]
}
}).state('home', {
parent: 'site',
url: '/',
data: {
roles: []
},
views: {
'content@': {
templateUrl: "views/main.html",
controller: 'MainCtrl',
controllerAs: 'main'
}
}
}).state('register', {
parent: 'site',
url: '/register',
data: {
roles: []
},
views: {
'content@': {
templateUrl: 'views/register.html',
controller: 'RegisterCtrl',
controllerAs: 'register'
}
}
}).state('login', {
parent: 'site',
url: '/login',
data: {
roles: []
},
views: {
'content@': {
templateUrl: 'views/login.html',
controller: 'LoginCtrl',
controllerAs: 'vm'
}
}
}).state('about', {
parent: 'site',
url: '/about',
data: {
roles: []
},
views: {
'content@': {
templateUrl: 'views/about.html',
controller: 'AboutCtrl',
controllerAs: 'about'
}
}
}).state('products', {
parent: 'site',
url: '/products',
data: {
roles: []
},
views: {
'content@': {
templateUrl: 'views/products.html',
controller: 'ProductsCtrl',
controllerAs: 'products'
}
}
}).
state('product', {
parent: 'site',
url: '/product/:productCode',
data: {
roles: []
},
views: {
'content@': {
templateUrl: 'views/product.html',
controller: 'ProductCtrl',
controllerAs: 'product'
}
}
}).state('cart', {
parent: 'site',
url: '/cart',
data: {
roles: []
},
views: {
'content@': {
templateUrl: 'views/cart.html',
controller: 'CartCtrl',
controllerAs: 'cart'
}
}
}).state('productCockpit', {
parent: 'site',
url: '/productCockpit',
data: {
roles: ['Admin']
},
views: {
'content@': {
templateUrl: 'views/productcockpit.html',
controller: 'ProductcockpitCtrl',
controllerAs: 'productCockpit'
}
}
}).state('manageProduct', {
parent: 'site',
url: '/productCockpit/:productCode',
data: {
roles: ['Admin']
},
views: {
'content@': {
templateUrl: 'views/manageproduct.html',
controller: 'ManageproductCtrl',
controllerAs: 'manageProduct'
}
}
}).state('userCockpit', {
parent: 'site',
url: '/userCockpit',
data: {
roles: ['Admin']
},
views: {
'content@': {
templateUrl: 'views/usercockpit.html',
controller: 'UsercockpitCtrl',
controllerAs: 'userCockpit'
}
}
}).state('manageUser', {
parent: 'site',
url: '/userCockpit/:username',
data: {
roles: ['Admin']
},
views: {
'content@': {
templateUrl: 'views/manageuser.html',
controller: 'ManageuserCtrl',
controllerAs: 'manageUser'
}
}
}).state('accessdenied', {
parent: 'site',
url: '/denied',
data: {
roles: []
},
views: {
'content@': {
templateUrl: 'views/denied.html'
}
}
});
}
]);
angular.module("clientApp")
.run(['$rootScope', '$state', '$stateParams', 'authorization', 'principal',
function($rootScope, $state, $stateParams, authorization, principal) {
$rootScope.$on('$stateChangeStart', function(event, toState, toStateParams) {
$rootScope.toState = toState;
$rootScope.toStateParams = toStateParams;
if (principal.isIdentityResolved()){
authorization.authorize();
}
});
}
]);
登录控制器中的代码:
'use strict';
/**
* @ngdoc function
* @name clientApp.controller:LoginCtrl
* @description
* # LoginCtrl
* Controller of the clientApp
*/
angular.module('clientApp')
.controller('LoginCtrl', function ($state, AuthenticationService) {
var vm = this;
function login() {
vm.dataLoading = true;
AuthenticationService.Login(vm.username, vm.password, function (response) {
if (response.success) {
AuthenticationService.SetCredentials(response.token);
$state.go('products');
} else {
AuthenticationService.ClearCredentials();
///FlashService.Error(response.message);
vm.dataLoading = false;
}
});
}
vm.login = login;
});
Html视图:
<div class="col-md-6 col-md-offset-3">
<h2>Login</h2>
<div ng-show="vm.error" class="alert alert-danger">{{vm.error}}</div>
<form name="form" ng-submit="vm.login()" role="form">
<div class="form-group" ng-class="{ 'has-error': form.username.$dirty && form.username.$error.required }">
<label for="username">Username</label>
<input type="text" name="username" id="username" class="form-control" ng-model="vm.username" required />
<span ng-show="form.username.$dirty && form.username.$error.required" class="help-block">Username is required</span>
</div>
<div class="form-group" ng-class="{ 'has-error': form.password.$dirty && form.password.$error.required }">
<label for="password">Password</label>
<input type="password" name="password" id="password" class="form-control" ng-model="vm.password" required />
<span ng-show="form.password.$dirty && form.password.$error.required" class="help-block">Password is required</span>
</div>
<div class="form-actions">
<button type="submit" ng-disabled="form.$invalid || vm.dataLoading" class="btn btn-primary">Login</button>
<img ng-if="vm.dataLoading" src="data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==" />
<a href="#/register" class="btn btn-link">Register</a>
</div>
</form>
</div>
登录
{{vm.error}
用户名
用户名是必需的
密码
密码是必需的
登录
您能否同时提供相关的html
代码?你怎么做重定向?通过单击按钮或?我添加了html视图。我使用ng submit指令调用控制器中的登录方法。这可能是后端服务的问题。您如何实施身份验证服务
?大家好,谢谢您的回答。我终于找到了问题所在。是我的后端服务工作不正常。谢谢你的帮助!