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”而不是＃。

你需要为.when语句使用$ routeProvider，否则角度不能用户使用$ 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'
            });

    });

如果您发现我更改了＃34; /＆＃34;到＆＃34; / home＆＃34; 我检查过，它正在工作。如果它不在你的最后工作那就让我吧

路由Angular JS不工作而不抛出错误

3 个答案: