MEAN角度ui路由器未加载状态 [英] MEAN angular ui-router doesn't load states
问题描述
我正在使用meanstack建立一个网站.但是，它无法加载我在app.js中定义的任何状态.并且控制台中没有显示任何错误，并且每个js文件都已成功加载.这是我的index.html:
I am building a website using meanstack. However, it failed to load any state I defined in app.js. And there is no errors shown in console, and every js file is loaded successfully. Here is my index.html:
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<base href="/"></base>
<title>E-study</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="angular-loading-bar/build/loading-bar.css">
<link rel="stylesheet" type="text/css" href="bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="app.less">
<!-- <link rel="stylesheet" type="text/css" href="app/_naut/less/styles.less"> -->
</head>
<body ng-app="E-study">
<div id="main">
<div id="topbar" class="topbar" style="width: auto;">
<div class="fill">
<div class="container">
<h1 style="align: center;">E-study - a website for English self study</h1>
</div>
</div>
</div>
<div data-ui-view data-autoscroll="false" class="app-container ng-scope"></div>
</div>
</body>
</html>
app.js:
'use strict';
var Estudy = angular.module('E-study', ['ngCookies', 'ngResource', 'ngSanitize', 'ui.router', 'naut']);
Estudy.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', '$httpProvider', 'RouteProvider', function ($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider, Route){
$stateProvider
.state('login', {
url: '/login',
templateUrl: 'client/views/login.html',
controller: 'loginCtrl'
})
.state('signup', {
url: '/signup',
templateUrl: 'client/views/signup.html',
controller: 'signupCtrl'
})
.state('recover', {
url: '/resetPwd',
templateUrl: 'client/views/recover.html',
controller: 'recoverCtrl'
});
$urlRouterProvider.otherwise('/login');
$locationProvider.html5Mode(true);
$httpProvider.interceptors.push('authInterceptor');
}])
.factory('authInterceptor', function ($rootScope, $q, $cookieStore, $location){
return{
request: function (config){
config.headers = config.headers || {};
if ($cookieStore.get('token')) {
config.headers.Authorization = 'Bearer' + $cookieStore.get('token');
};
return config;
},
responseError: function (response){
if (response.status === 401) {
$location.path('/login');
$cookieStore.remove('token');
return $q.reject(response);
} else {
return $q.reject(response);
};
}
};
})
.run(function($state){
$state.go('login');
});
});
我在根目录中运行server.js，我项目的整个文件目录为:文件目录
I run the server.js in the root directory, the whole file directory of my project is: file directory
谢谢.
推荐答案
我发现了问题，即我定义了重复路线
I have found the problem, that is I defined duplicate route
app.use('/'，function(req，res，err){res.sendFile('index.html'，{root:path.join(__ dirname，'../client')}))})
放置在routes.js文件中，并放在
in the routes.js file, and put it before
app.route('/*').get(function(req，res){res.sendFile('index.html'，{root:path.join(__ dirname，'../client')});;});
删除第一个代码后，它将正确加载状态.
After I delete the first code, it loads the state correctly.
这篇关于MEAN角度ui路由器未加载状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
