Question

编辑：对于每个感兴趣的人：我通过将基本标记添加到html文件的头部来解决了这个问题。

我正在尝试使用单页路由来运行测试应用。经过一些研究后，我找不到任何关于我可能遗失的内容的提示。

这是我的代码:(任何想法？）

// 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”。没有用。可能是我找不到的拼写错误：）

EDIT 在这里创建了一个plunker：https://embed.plnkr.co/L7PSkNPoxSO7shtRx5JZ/

Answer 1

如果您尝试动态使用路由和加载控制器/视图，则此处不需要ng-controller：<body ng-app="app" ng-controller="DashboardController">，它将根据您的路由配置和当前路由动态加载。

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

Angular.js路由不起作用

1 个答案: