[英]AngularJS split into multiple files - only the last one works
I've got into an issue where having split my logic of AngularJS app into multiple files brought me an issue where only the last one works and the previous ones are probably skipped. 我遇到了一个问题,即将我的AngularJS应用程序的逻辑拆分成多个文件,这给我带来了一个问题,即只有最后一个工作,而之前的工作可能会被跳过。
Here's the index.html inclusion: 这是index.html包含:
<script src="js/app.js"></script>
<script src="js/app.config.js"></script>
<script src="js/controllers/HomeController.js"></script>
Each file contains very small amount of logic: 每个文件包含非常少量的逻辑:
Initialisation: 初始化:
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();
}
});
});
Config: 配置:
angular.module('sportcial', ['ionic']).config(function configApp($ionicConfigProvider) {
alert(1);
$ionicConfigProvider.tabs.position('bottom');
});
HomeController: HomeController的:
angular.module('sportcial', ['ionic'])
.config(function config($stateProvider, $urlRouterProvider) {
alert(3)
})
.controller('HomeController', ['$scope', function HomeController($scope) {
var home = this;
}]
);
Only the last one fires the alert(3)... 只有最后一个触发警报(3)......
What am I missing here guys? 我在这里想念的是什么? :)
:)
You're overwriting the sportcial
module in each file. 你正在覆盖每个文件中的
sportcial
模块。
Use the setter syntax 使用setter语法
angular.module("moduleName", [moduleDependencies, ..])
To create a module. 创建模块。
If you want to add something to an existing module, you need to call the getter: 如果要向现有模块添加内容,则需要调用getter:
angular.module("moduleName")
So for example, you need to update your config file to: 例如,您需要将配置文件更新为:
angular.module('sportcial').config(function configApp($ionicConfigProvider) {
alert(1);
$ionicConfigProvider.tabs.position('bottom');
});
Any angular module should only be defined once with its dependencies: 任何角模块应与它的依赖一次定义:
angular.module('sportcial', ['ionic'])
but it can be retrieved as many times as needed by calling module
without the dependencies: 但是在没有依赖项的情况下调用
module
可以根据需要多次检索它:
angular.module('sportcial').config(....
angular.module('sportcial').controller(....
You'll have to make sure to include the module definition with dependencies before including all other files for the same module. 在包含同一模块的所有其他文件之前,您必须确保包含具有依赖关系的模块定义。
See also 'Creation versus Retrieval' : 另请参阅“创建与检索” :
Beware that using
angular.module('myModule', [])
will create the modulemyModule
and overwrite any existing module namedmyModule
.请注意,使用
angular.module('myModule', [])
将创建模块myModule
并覆盖任何名为myModule
现有模块。 Useangular.module('myModule')
to retrieve an existing module使用
angular.module('myModule')
检索现有模块
You are declaring a new module in each file. 您在每个文件中声明一个新模块。
Angular syntax for setting a module is : 设置模块的角度语法是:
angular.module('moduleName', dependenciesArray);
For getting the module and subsequently define it's modules the syntax is as follows: 为了获得模块并随后定义它的模块,语法如下:
angular.module('moduleName');
Remove the array with the ionic dependency from your config and controller files. 从配置文件和控制器文件中删除具有离子依赖性的数组。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.