use*_*947 5 angularjs angular-ui-router
我是AngularJs的新手，我正在尝试使此ui路由正常运行，但没有运气。这是我的.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文件，我尝试在其中注入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'” transitionTo @ 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");
});
| 归档时间： |
|
| 查看次数： |
25963 次 |
| 最近记录： |