Question

我正在尝试使用角度路由，但它不起作用，我也没有在控制台中出现任何错误。有人可以指导我做错了吗？

**** **** app.js

var routingApp = angular.module('routingApp', ['ngRoute']);
routingApp.config(function ($routeProvider)
{
    $routeProvider.when('/', {
        templateUrl: '/views/home.html',
        controller: 'mainController'
    })
    .when('/about', {
        templateUrl: '/views/about.html',
        controller: 'aboutController'
    })
    .when('/contact', {
        templateUrl: '/views/contact.html',
        controller: 'contactController'
    });
});

mainController

routingApp.controller('mainController', function ($scope)
{
    $scope.message = 'Hey its home page';
}
)

aboutController

routingApp.controller('aboutController', function ($scope)
{
    $scope.message = 'this app is about routing';
});

的index.html

**

 <body ng-controller="mainController">
        <nav class="nav navbar-default">
            <div class="container">
                <div class="navbar-header">
                    Angular JS Routing
                </div>
                <ul class="nav navbar-nav navbar-right">
                <li><a href="/">Home</a></li>
                <li><a href="#/about">About</a></li>
                <li><a href="#/Contact">Contact</a></li>
                </ul>
            </div>
        </nav>
        <div id="main">
            <div ng-view></div>
        </div>
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>
        <script src="app.js"></script>
        <script src="controller/mainController.js"></script>
        <script src="controller/contactController.js"></script>
        <script src="controller/aboutController.js"></script>

**

Answer 1

请检查您的href

<li><a href="/">Home</a></li>
<li><a href="#/about">About</a></li>
<li><a href="#/Contact">Contact</a></li>

Answer 2

缺少指令ng-app，而不是将ng-controller添加到body，请添加ng-app="routingApp"

请改善链接联系页面，而不是#/Contact，请使用#/contact

路由不适用于角水疗中心

2 个答案: