Angular.js路由不起作用

问题描述：

编辑：对于所有感兴趣的人：我通过将基本标记添加到html文件的头部来解决该问题。Angular.js路由不起作用

我试图让单个页面路由工作的测试应用程序。经过一番研究，我找不到任何关于我可能错过的提示。

这里是我的代码：（任何想法？）

// 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正在运行（断点在浏览器中显示）。我也尝试了hrefs“#test”，“＃！test”，“＃！/ test”。没有工作。可能是一个错字，我没有找到:)

编辑创建一个plunker这里：https://embed.plnkr.co/L7PSkNPoxSO7shtRx5JZ/

在您的代码片段中，dashboardCtrl.js显示404未找到。你可以尝试一些猛击或jsfiddle – XPD

答

如果你想使用动态路由和负载控制器/视图，你不需要ng-controller这里：<body ng-app="app" ng-controller="DashboardController">，它会根据您的路由配置和当前路由动态加载。

您是否忘记为您的控制器声明视图以查看路由更改的任何更改？

谢谢，好点。但并不能解决问题。 –

@EmanuelMetzenthin，你不忘记为你的控制器声明视图来查看路由变化的任何变化吗？ 'views/dashboard.html'和'views/testTemplate.html'不是空的？ –

它们存在。我只是没有发布他们的问题 –

Angular.js路由不起作用

相关推荐