我是 AngularJs 的新手，我正在尝试让这个 ui-route 工作，但没有运气。这是我的 .js 文件的一个片段，其中包含路由配置。
//object for routing
var route = angular.module('route', ["ui.router"])
// configure the routing
route.config(function($stateProvider, $urlRouterProvider) {
// send to profile page
$urlRouterProvider.otherwise("/personal_info");
$stateProvider // route for personal info
.state('personal_info', {
url: "/personal_info",
templateUrl : 'personal_info.html' ,
controller : 'persController'
})
});
这是我的 html 文件，我尝试在其中注入(inject) ui-veiw 并使用路由实现导航栏。
<!DOCTYPE html>
<html ng-app='app'>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate, pre-check=0, post-check=0, max-age=0" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.min.js"> </script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular-resource.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.10.0/ui-bootstrap-tpls.min.js"></script>
<script src="client_UI.js"></script>
<script src="angular.js"></script>
<script src="//angular-ui.github.io/ui-router/release/angular-ui-router.js"></script>
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" media="screen">
<link rel = "stylesheet" type="text/css" href="css/bootstrap.css">
<link rel = "stylesheet" type="text/css" href="css/mycss.css"> </head>
<body>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="js/bootstrap.js"></script><!-- navigation bar -->
<div class="navbar-header">
<a class="brand" ui-sref="#">Home</a>
<ul class="nav nav-pills">
<li><a class="active" ui-sref="personal_info">Personal Info</a></li>
<li><a ui-sref="cog_health">Cognitive Health</a></li>
<li><a ui-sref="gen_health">General Health</a></li>
</ul>
</div>
<div class="container">
<div ui-view></div>
</div>
</div>
</body>
</html>
我收到此错误，内容为“错误:无法从状态 ' 解析 'peronal_info'” 过渡到@ http://angular-ui.github.io/ui-router/release/angular-ui-router.js:1971 ...”。有人可以给我一个关于如何解决这个问题的提示吗？
谢谢
更新:我已经修复了语法问题，现在我收到了一个如下所示的错误，
"GET http://localhost:3000/personal_info.html [HTTP/1.1 401 Unauthorized 1ms]"
最佳答案
这是我的 app.js 与 ui-router 的示例。
'use strict';
angular.module('srcApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'ui.router'
])
.config(function ($stateProvider, $urlRouterProvider, $locationProvider) {
$stateProvider
.state('lang', {
url: '/:lang',
templateUrl: '../views/interface.html',
controller:'MainCtrl'
});
$locationProvider.html5Mode(true).hashPrefix('!');
$urlRouterProvider.when('/', '/en');
$urlRouterProvider.otherwise('/en');
});
我建议您尝试一些类似的事情:
//object for routing
var app = angular.module('app', ["ui.router"]);
// configure the routing
app.config(function($stateProvider, $urlRouterProvider) {
$stateProvider // route for personal info
.state('index', {
url: "/personal_info",
templateUrl : 'personal_info.html' ,
controller : 'persController'
});
// send to profile page
$urlRouterProvider.otherwise("/personal_info");
});
关于AngularJs ui-router "could not resolve state"错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24456960/