AngularJS分成多个文件 - 只有最后一个文件有效

Question

我遇到了一个问题,即将我的AngularJS应用程序的逻辑拆分成多个文件,这给我带来了一个问题,即只有最后一个工作,而之前的工作可能会被跳过.

这是index.html包含:

<script src="js/app.js"></script>
<script src="js/app.config.js"></script>
<script src="js/controllers/HomeController.js"></script>

每个文件包含非常少量的逻辑:

初始化:

angular.module('sportcial', ['ionic'])
.run(function run($ionicPlatform) {
    alert(2);
    $ionicPlatform.ready(function() {
        // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
        // for form inputs)
        if(window.cordova && window.cordova.plugins.Keyboard) {
          cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
        }

        if(window.StatusBar) {
          StatusBar.styleDefault();
        }
    });
});

配置:

angular.module('sportcial', ['ionic']).config(function configApp($ionicConfigProvider) {
    alert(1);
    $ionicConfigProvider.tabs.position('bottom');
});

HomeController的:

angular.module('sportcial', ['ionic'])
    .config(function config($stateProvider, $urlRouterProvider) {
        alert(3)
    })
    .controller('HomeController', ['$scope', function HomeController($scope) {
        var home = this;
    }]
);

只有最后一个触发警报(3)......

我在这里想念的是什么？:)

Answer 1

你正在覆盖sportcial每个文件中的模块.

使用setter语法

angular.module("moduleName", [moduleDependencies, ..])

创建模块.

如果要向现有模块添加内容,则需要调用getter:

angular.module("moduleName")

例如,您需要将配置文件更新为:

angular.module('sportcial').config(function configApp($ionicConfigProvider) {
    alert(1);
    $ionicConfigProvider.tabs.position('bottom');
});