Question

我想使用Angular-route来更改页面中使用的控制器
这是我的角度代码的一部分

<a href="#" onclick="window.open('http://mywebsite1.com'); window.open('http://mywebsite1.com');">Click Me</a>

这是我的html的一部分

var cat_list = angular.module('getCat', ['ngRoute']);

cat_list.config(function($routeProvider, $locationProvider) {
    $routeProvider
    .when('category/upcoming', {
       controller: 'getUpcoming'
    })
    .when('category/popular', {
        controller: 'getPopular'
    });

    $locationProvider.html5Mode(true);
});

cat_list.controller('getUpcoming', ['$scope', function($scope, $routeParams) {
//controller code goes here
});
cat_list.controller('getPopular', ['$scope', function($scope, $routeParams) {
//controller code goes here
});

但是当我尝试访问<div class="row" ng-app="getCat"> <div class="col-md-12">  </div> </div>或http://localhost/project/category/upcoming时，路线无效（未选择任何控制器）

我错过了什么吗？

Answer 1

试试这个

var cat_list = angular.module('getCat', ['ngRoute']);

cat_list.config(['$routeProvider', '$locationProvider',

等等。

您能否解释为什么要在同一页面上使用不同的控制器？为什么不使用两个不同的部分为即将到来的流行创建两个单独的页面？

或者，另一种方法是使用相同的控制器，并使用适当的指令过滤结果，而不会更改每次加载的内容。

Answer 2

必须提及ng-view，以便此指令是占位符，用于替换关于网址更改的视图部分。

<div class="row" ng-app="getCat">
    <div class="col-md-12">
        <div ng-view></div> // ---- This is the thing you missed
    </div>
</div>

angularjs路线改变控制器

2 个答案: