无法使用angular-ui路由器进行路由

该应用不会路由到视图。它只是显示index.html视图看不到任何其他视图。它在改变路由器之前工作正常。我也尝试在index.html中将ng-view更改为ui-view，但仍然没有任何反应。无法使用angular-ui路由器进行路由

寻找铬devtools，我可以看到，角和ui路由器都被加载，所以它必须是代码中的东西。我希望有经验的人能注意到它。十分感谢！

我的index.html和app.js：

'use strict'; 
 

 
// Declare app level module which depends on views, and components 
 
angular.module('myApp', [ 
 
    'ui.router', 
 
    'myApp.jokes', 
 
    'myApp.view1', 
 
    'myApp.view2', 
 
    'myApp.auth', 
 
    'myApp.version' 
 
]). 
 
config(['$routeProvider', function($routeProvider) { 
 
    $routeProvider.otherwise({redirectTo: '/view1'}); 
 
}]);

<!DOCTYPE html> 
 
<!--[if lt IE 7]>  <html lang="en" ng-app="myApp" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
 
<!--[if IE 7]>   <html lang="en" ng-app="myApp" class="no-js lt-ie9 lt-ie8"> <![endif]--> 
 
<!--[if IE 8]>   <html lang="en" ng-app="myApp" class="no-js lt-ie9"> <![endif]--> 
 
<!--[if gt IE 8]><!--> <html lang="en" ng-app="myApp" class="no-js"> <!--<![endif]--> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <title>My AngularJS App</title> 
 
    <meta name="description" content=""> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="bower_components/html5-boilerplate/dist/css/normalize.css"> 
 
    <link rel="stylesheet" href="bower_components/html5-boilerplate/dist/css/main.css"> 
 
    <link rel="stylesheet" href="app.css"> 
 
    <script src="bower_components/html5-boilerplate/dist/js/vendor/modernizr-2.8.3.min.js"></script> 
 
</head> 
 
<body> 
 
    <ul class="menu"> 
 
    <li><a href="#/view1">view1</a></li> 
 
    <li><a href="#/view2">view2</a></li> 
 
    </ul> 
 

 
    <!--[if lt IE 7]> 
 
     <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p> 
 
    <![endif]--> 
 

 
    <div ng-view></div> 
 

 
    <div>Angular seed app: v<span app-version></span></div> 
 

 
    <!-- In production use: 
 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/x.x.x/angular.min.js"></script> 
 
    --> 
 
    <script src="bower_components/angular/angular.js"></script> 
 
    <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script> 
 
    <script src="app.js"></script> 
 
    <script src="view1/view1.js"></script> 
 
    <script src="view2/view2.js"></script> 
 
    <script src="view_auth/auth.js"></script> 
 
    <script src="view_jokes/jokes.js"></script> 
 
    <script src="components/version/version.js"></script> 
 
    <script src="components/version/version-directive.js"></script> 
 
    <script src="components/version/interpolate-filter.js"></script> 
 
</body> 
 
</html>

来源

2015-11-23 Coding Learner

你加载你的模板和控制器命名视图

views: { 
    'jokesContent': { 
    templateUrl: "view_auth/auth.html", 
    controller: 'AuthCtrl as auth' 
}

，但你不要定义视图。
你必须使用：ui-view="jokesContent" 或重写你的路由器配置不使用命名视图

.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) { 
    $stateProvider 
    .state('auth', { 
    url: '/auth', 
    templateUrl: "view_auth/auth.html", 
    controller: 'AuthCtrl as auth' 
    }) 
}])

来源

2015-11-23 14:10:35 koox00

我尝试将ng-view更改为

，但路线仍然不合常规。我是否需要刷新某些内容或清除缓存？我停止npm并且再次启动npm。 –

看开发工具，网络面板，做html加载？ – koox00

刚看，html不加载先生，只有js文件。 –

看到你的代码后，我可以注意到的第一件事是您正在使用ng-view，而不是ui-view。由于您在应用程序中使用的是ui-router，因此您需要使用ui-view而不是ng-view。

所以，只要改变它就像上面，检查一次。

来源

2015-11-23 13:35:15 Achu

嗨阿舒，感谢您的回复。我在我的帖子中写道，我已经尝试了这个，但问题仍然存在。你知道还有什么可能吗？ –

请澄清以下事项： 1.您想将您的页面重新指向哪条路线？ 2.您是否使用嵌套视图？或者告诉我你在这里试图做什么。 – Achu

谢谢你试图帮助阿丘！我正在尝试遵循本指南：http://baljeetsingh.in/blog/series-build-an-app-with-laravel5-backend-and-angularjs-frontend-part-2-555/#Creating_New_Routes 我被卡在“客户端身份验证”部分之前，它没有路由到/＃/ auth或/＃/笑话。你能快速浏览一下教程，看看你是否找到它可能是什么？非常感谢！ –

无法使用angular-ui路由器进行路由

回答

相关问题