为 angular 模块定义路由

Question

我有一个 mainApp.js 文件，我把这段代码放在上面：

var mainApp = angular.module('mainApp', []);

**//ROUTES**
mainApp.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
     .when('/index',
    {
        templateUrl: '/Views/Admin/index.html'
    }
     );
}]);

当我运行我的应用程序没有 ROUTES 部分时，一切正常，但是当我将它们添加到 mainApp.js 文件时，我遇到了 $injector:modulerr我的错误浏览器。

我尝试清除浏览器缓存，检查 html 页面以确保包含 mainApp.js 文件并将我的代码替换为这些：

var mainApp = angular.module('mainApp', []).config(config);

config.$inject = ['$routeProvider'];
function config($routeProvider) {
    $provider
    .when('/index',
    {
        templateUrl: '/Views/Admin/index.html'
    }
    );
}

但是什么也没发生，我又遇到了那个错误。

你能帮帮我吗？

谢谢

Answer 1

你需要注入 ngRoute 作为依赖，同时参考 angular-router 库，

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>

控制器

 var mainApp = angular.module('mainApp', [ngRoute]).config(config);

DEMO

Answer 2

我注意到几个问题：

您尚未在 module 函数中声明 ngRoute 依赖项。

应该是:

var mainApp = angular.module('mainApp', ['ngRoute']).config(config);

而不是：

var mainApp = angular.module('mainApp', []).config(config);

您对使用的对象感到困惑：$routeProvider 和 $provider。 $Provider 与映射 url.
为什么在 templateUrl 之前使用 /？
config.$inject = ['$routeProvider']应该不需要。

试试看：

angular.module('mainApp', ['ngRoute'])
       .config(
            function ($routeProvider) {

         $routeProvider
            .when('/index', {
                templateUrl: 'Views/Admin/index.html'
            })
       };
);

为 angular 模块定义路由

Defining routes for a angular module

model-view-controller

angularjs

angular-routing