AngularJs ui-route「無法解析狀態」錯誤

Im新的AngularJs和我試圖讓這個ui-route工作，但沒有運氣。這是包含路由配置的.js文件的一部分。AngularJs ui-route「無法解析狀態」錯誤

//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]"

來源

2014-06-27 user3783947

不應該在app.js（angular.js或client_ui.js）之前加載angular-ui-router.js？ –

我修改了我的代碼，並在angular.js和client_ui.js之前加載了angular-ui-router.js，但我仍然收到相同的錯誤 – user3783947

如果personal_info是您唯一的狀態，您是否嘗試將其更改爲索引？不完全確定，但ui-router默認情況下可能需要索引狀態。（糾正我，如果我錯了） –

這裏是我的app.js與UI的路由器的一個例子。

'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"); 
});

來源

2014-06-27 17:22:01

你是一個拯救生命的人！非常感謝。你能解釋一下爲什麼我們使用'index'作爲狀態而不是personal_info？ – user3783947

如果ui-router需要索引狀態，我只是不確定（因此懶惰在這個假期）。 –

我有同樣的問題。但我通過使用來自unpkg.com的angular-ui-router.js的最新版本解決了我的問題。我使用3.2版本。

來源

2017-01-13 15:46:47

AngularJs ui-route「無法解析狀態」錯誤

回答

相關問題