26

我试图让我的头脑围绕 AngularJS 并遇到了一个问题。

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

myApp.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {

    console.log('Configuring module "myApp"');

    $routeProvider.when('/dashboard', {templateUrl: 'partial/dashboard', controller: DashboardController});
    $routeProvider.when('/menu', {templateUrl: 'partial/other', controller: OtherController});
    $routeProvider.otherwise({redirectTo: '/dashboard'});

    $locationProvider.html5Mode(true);
 }]);

据我了解，应该在加载模块时调用配置函数。但事实并非如此！

我在标签上有ng-app="myApp"指令。<body>并且脚本以正确的顺序在正文结束标记之前加载（就这一点而言）。

    <script src="angular.js"></script>      
    <script src="app.js"></script>
    <script src="services.js"></script>
    <script src="controllers.js"></script>
</body>

我很确定我必须在这里忽略一些微不足道的事情。应该有一条消息打印到控制台。但它仍然是空的，没有任何错误或警告。

不依赖于路线的应用程序部分运行良好。

更新：我的 service.js 的简化版本

'use strict';

angular.module('myApp', function ($provide) {
    $provide.factory('myService', function ($http) {
        var service = function () {
            ...
            service implementation
            ...
        };

        return new service();
    });
});
4

3 回答 3

32

我用来定义服务的方法似乎覆盖了我的myApp模块。

这是最重要的线

angular.module('myApp', function ($provide) ...

此代码只是重新定义myApp模块并添加一个函数来配置该模块。

我将 service.js 重构为这个简化版本，它开始工作了。

var myApp = angular.module('myApp');

myApp.factory('securityService', function () {
    return SomeFancyServiceObject();
});
于 2013-04-08T13:18:46.917 回答
11

我在我的 html 标记中缺少 ng-app="myApp" - 我在阅读您的问题时意识到了这一点:-)

于 2016-03-17T14:11:59.200 回答
0

我通常看到通过将它们链接在一起来应用路由：

$routeProvider
    .when('/dashboard', {templateUrl: 'partial/dashboard', controller: DashboardController})
    .when('/menu', {templateUrl: 'partial/other', controller: OtherController})
    .otherwise({redirectTo: '/dashboard'});

看不出为什么你的不起作用，但可能值得一试。

于 2013-04-08T11:48:47.243 回答