路由Angular JS不工作而不拋出錯誤

Question

我試圖使用$routeProvider 。 但有些不對勁，我不知道是什么。 控制台沒有拋出錯誤，我的頁面沒有任何反應。 我糊塗了。 對我有什么解決方案？

這是我的代碼：

var app = angular.module("admin-rv-app", ['ngRoute']);

    app.config(function($routeProvider) {
        $routeProvider

            // route for the home page
            .when('/', {
                templateUrl : 'templates/home.html',
                controller  : 'homeController'
            })

            // route for the thread page
            .when('/thread', {
                templateUrl : 'templates/thread.html',
                controller  : 'threadController'
            });

    });

app.controller('homeController', function($scope) {
    $scope.message = "Welcome Home";
});

app.controller('threadController', function($scope) {
    $scope.message = "Welcome to Thread";
});

這是我的HTML

<li>
    <a href="#">
    <i class="fa fa-home fa-3x" aria-hidden="true"></i>
    <span class="title">Home</span>
    <span class="selected"></span>
    </a>
</li>
<li>
    <a href="#thread">
    <i class="fa fa-briefcase fa-3x" aria-hidden="true"></i>
    <span class="title">Thread + Answer</span>
    <span class="selected"></span>
    </a>
</li>

順便說一句，我包括angular.min.js和angular.route.min.js和ng-app="admin-rv-app"

Answer 1

我認為問題是你如何創建你的app.config。

    app.config(["$routeProvider", function($routeProvider){  
        $routeProvider.when('/', {
            templateUrl : 'templates/home.html',
            controller  : 'homeController'
        })

        // route for the thread page
        .when('/thread', {
            templateUrl : 'templates/thread.html',
            controller  : 'threadController'
        });   
}])

請嘗試這樣做，並且不要將$ scope添加到模塊中，這只會給你更多的錯誤來處理。

同時將標記更改為“/ thread”而不是＃。

您需要使用$ routeProvider作為.when語句，否則角度不能使用$ routeProvider來獲取不同的視圖

Answer 2

在控制器中注入$ location服務

之后

<a ng-click="changeLocation()"/>

和

$scope.changeLocation = function (){
    $location.path('/thread')
}

Answer 3

嘗試在HTML中使用它：

<li>
        <a href="#home">
            <i class="fa fa-home fa-3x" aria-hidden="true"></i>
            <span class="title">Home</span>
            <span class="selected"></span>
        </a>
    </li>
    <li>
        <a href="#thread">
            <i class="fa fa-briefcase fa-3x" aria-hidden="true"></i>
            <span class="title">Thread + Answer</span>
            <span class="selected"></span>
        </a>
    </li>

並將路由器代碼更改為：

 app.config(function($routeProvider) {
        $routeProvider

            // route for the home page
            .when('/home', {
              templateUrl: 'app/dashboard/home.html',
              controller: 'homeController'
           })

            // route for the thread page
            .when('/thread', {
                templateUrl : 'templates/thread.html',
                controller  : 'threadController'
            });

    });

如果您注意到我已將URL從“/”更改為“/ home”並且我已經檢查過，那么它正在運行。 如果它不能在你的最后工作，請告訴我