简体   繁体   English

Angular.js路由不起作用

[英]Angular.js Routing Does Not Work

EDIT: For everyone interested: I solved the issue by adding the base tag to the head of the html file. 编辑:对于每个感兴趣的人:我通过将基本标记添加到html文件的开头解决了该问题。

I am trying to get a test app with single page routing to work. 我正在尝试使用单页路由来运行测试应用程序。 After some research I couldn't find any hint online on what I might be missing. 经过一番研究,我找不到关于我可能缺少的东西的任何在线提示。

Here's my code: (Any ideas?) 这是我的代码:(有什么想法吗?)

 // public/js/app.js var app = angular.module('app', ['ngRoute', 'DashboardCtrl']); app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { $routeProvider .when('/', { templateUrl: 'views/dashboard.html', controller: 'DashboardController' }) .when('/test',{ templateUrl: 'views/testTemplate.html', controller: 'DashboardController' }); $locationProvider.html5Mode(true); }]); 
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Dashboard</title> <!-- CSS --> <link rel="stylesheet" href="libs/bootstrap/dist/css/bootstrap.min.css"> <link rel="stylesheet" href="css/style.css"> <!-- JS --> <script src="libs/angular/angular.min.js"></script> <script src="libs/angular-route/angular-route.min.js"></script> <!-- ANGULAR CUSTOM --> <script src="js/controllers/DashboardCtrl.js"></script> <!--<script src="js/appRoutes.js"></script>--> <script src="js/app.js"></script> </head> <body ng-app="app" ng-controller="DashboardController"> <h1>Dashboard</h1> <a href="/test">Testing</a> <div ng-view></div> </body> </html> 

 // public/js/controllers/DashboardCtrl.js angular.module('DashboardCtrl', []).controller('DashboardController', function($scope) { // todo }); 

App.js is being run (breakpoints in the browser show). App.js正在运行(浏览器中的断点显示)。 I also tried the hrefs "#test", "#!test", "#!/test". 我还尝试了hrefs“ #test”,“#!test”,“#!/ test”。 None worked. 没有工作。 Might be a typo that I don't find :) 可能是我找不到的错字:)

EDIT Created a plunker here: https://embed.plnkr.co/L7PSkNPoxSO7shtRx5JZ/ 编辑在这里创建了一个punker: https ://embed.plnkr.co/L7PSkNPoxSO7shtRx5JZ/

If you're trying to use routing and load controllers/views dynamically, you don't need ng-controller here: <body ng-app="app" ng-controller="DashboardController"> , it will be loaded dynamically depending on your route config and current route. 如果您尝试动态使用路由并动态加载控制器/视图,则无需在此处使用ng-controller<body ng-app="app" ng-controller="DashboardController"> ,它将根据以下情况动态加载您的路线配置和当前路线。

And didn't you forget to declare views for your controllers to see any changes on route change? 难道您不忘记为控制器声明视图以查看路由更改的任何更改吗?

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM