Question

我的角度路由不起作用（点击链接不会导致路由更改）：

var smu72App = angular.module("smu72App", [
        "ngRoute"
]).
    config(function ($routeProvider, $locationProvider) {
        $routeProvider
            .when("/", {
                templateUrl: "/templates/home.html",
                controller: 'smu72Controller'
            })
            .when("/objects", {
                templateUrl: "/templates/objects.html",
                controller: 'smu72Controller'
            })
            .when("/object/:Id", {
                templateUrl: '/templates/object.html',
                controller: 'smu72Controller'
            })
        .otherwise({
            redirectTo: "/"
        });
        $locationProvider.html5Mode(true);
    });

这是持有ng-view的主页（为了更好的阅读而削减了一点）：

<!DOCTYPE html>
<html ng-app="smu72App">
....
    <base href="/">
 .....
<body data-spy="scroll" data-target="#navbar" data-offset="0">
   ...
                <div class="collapse navbar-collapse"> //THAT'S SCROLLSPY LINKS (NOT ANGULAR)
                    <ul class="nav navbar-nav">
                        <li class="active"><a href="/"><i class="fa fa-home" aria-hidden="true"></i></a></li>
                        <li><a href="#services"> УСЛУГИ</a></li>
                        <li><a href="#portfolio"> OБЪЕКТЫ</a></li>
                        <li><a href="#about-us"> OТЗЫВЫ</a></li>
                        <li><a href="#certificates"> СЕРТИФИКАТЫ</a></li>
                        <li><a href="#contact"> КОНТАКТЫ</a></li>
                    </ul>
                </div>
            </div>
        </div>
    <div ng-view></div>
  ...
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
    <script src="https://code.angularjs.org/1.5.3/angular-route.min.js"></script>
    <script src="https://code.angularjs.org/1.5.3/angular-resource.min.js"></script>
    <script src="Scripts/simplbox.min.js"></script>
    <script src="http://localhost:25018/Scripts/main.js"></script>
    <script src="http://localhost:25018/Scripts/app.js"></script>
    <script src="http://localhost:25018/Scripts/smu72Controller.js"></script>
</body>
</html>

Answer 1

首先声明你的模块

angular.module("smu72App", ["ngRoute"]);

然后初始化config

angular.module("smu72App").config("....ur routes in here");

您是否收到任何控制台错误？

我注意到你的主页标签href与你的主页以外的ur config部分中的路由不匹配，这就是你的主页加载正常的原因。

只是一个示例尝试你的锚标记，如<a href="#/about">或类似<a href="/about">因为我认为你不使用哈希并创建如下所示的路线

$routeProvider.when('/about', {
        templateUrl: 'partials/about.html',
        controller: 'AboutCtrl'
    });

角度路由不起作用

1 个答案: