5
5
6
6
An async loader for angular 1.x application.
7
7
8
- Support following components to dynamic register:
8
+ Support use dynamic angular module:
9
+ * ` app.useModule(name) `
9
10
10
- * ` .controller `
11
- * ` .services `
12
- * ` .filter `
13
- * ` .directive `
14
- * ` .value `
15
- * ` .constant `
16
- * ` .provider `
17
- * ` .decorator `
11
+ Support use origin methods to dynamic register angular components:
12
+
13
+ * ` app.controller `
14
+ * ` app.services `
15
+ * ` app.filter `
16
+ * ` app.directive `
17
+ * ` app.value `
18
+ * ` app.constant `
19
+ * ` app.provider `
20
+ * ` app.decorator `
18
21
19
22
Support following amd/cmd loaders:
20
23
@@ -27,25 +30,26 @@ Support `controllerUrl/denpendencies` config in `angular-ui-router` and `angular
27
30
* ` $stateProvider.state `
28
31
* ` $routeProvider.when `
29
32
33
+ # Demo
34
+
35
+ http://subchen.github.io/angular-async-loader/
30
36
31
37
# Installation
32
38
33
- NPM
39
+ npm
34
40
35
41
``` shell
36
42
npm install angular-async-loader
37
43
```
38
44
39
- BOWER
45
+ bower
40
46
41
47
``` shell
42
48
bower install https://github.com/subchen/angular-async-loader.git
43
49
```
44
50
45
51
# Usage
46
52
47
- See Sample: https://github.com/subchen/angular-async-loader/blob/master/sample/
48
-
49
53
** index.html**
50
54
51
55
``` html
@@ -61,6 +65,7 @@ require.config({
61
65
paths: {
62
66
' angular' : ' assets/angular/angular.min' ,
63
67
' angular-ui-router' : ' assets/angular-ui-router/release/angular-ui-router.min' ,
68
+ ' angular-ui-mask' : ' assets/angular-ui-mask/dist/mask' ,
64
69
' angular-async-loader' : ' assets/angular-async-loader/dist/angular-async-loader.min'
65
70
},
66
71
shim: {
@@ -88,7 +93,7 @@ define(function (require, exports, module) {
88
93
89
94
var app = angular .module (' app' , [' ui.router' ]);
90
95
91
- // initialze app module for async loader
96
+ // initialze app module for angular- async- loader
92
97
asyncLoader .configure (app);
93
98
94
99
module .exports = app;
@@ -112,15 +117,22 @@ define(function (require) {
112
117
controllerUrl: ' home/homeCtrl' ,
113
118
controller: ' homeCtrl'
114
119
})
115
- .state (' users' , app . route ( {
120
+ .state (' users' , {
116
121
url: ' /users' ,
117
122
templateUrl: ' users/users.html' ,
118
123
// new attribute for ajax load controller
119
124
controllerUrl: ' users/usersCtrl' ,
120
125
controller: ' usersCtrl' ,
121
- // load more controllers, services, filters, ...
126
+ // support to load more controllers, services, filters, ...
122
127
dependencies: [' services/usersService' ]
123
- }));
128
+ })
129
+ .state (' components' , {
130
+ url: ' /components' ,
131
+ templateUrl: ' components/components.html' ,
132
+ // new attribute for ajax load controller
133
+ controllerUrl: ' components/componentsCtrl' ,
134
+ controller: ' componentsCtrl'
135
+ });
124
136
}]);
125
137
});
126
138
```
@@ -131,25 +143,59 @@ define(function (require) {
131
143
define (function (require ) {
132
144
var app = require (' ../app' );
133
145
134
- // dynamic load services here or add into dependencies of state config
146
+ // dynamic load services here or add into dependencies of ui-router state config
135
147
// require('../services/usersService');
136
148
137
149
app .controller (' usersCtrl' , [' $scope' , function ($scope ) {
138
150
// shortcut to get angular injected service.
139
151
var userServices = app .get (' usersService' );
140
-
141
152
$scope .userList = usersService .list ();
142
153
}]);
143
154
144
155
});
145
156
```
146
157
158
+ ** components/componentsCtrl.js**
159
+
160
+ ``` js
161
+ define (function (require ) {
162
+ var app = require (' ../app' );
163
+
164
+ // dynamic load angular-ui-mask plugins for UI
165
+ require (' angular-ui-mask' );
166
+ app .useModule (' ui.mask' );
167
+
168
+ // dynamic load ng-tags-input plugins for UI
169
+ require (' ng-tags-input' );
170
+ app .useModule (' ngTagsInput' );
171
+
172
+ app .controller (' componentsCtrl' , [' $scope' , function ($scope ) {
173
+ ......
174
+ }]);
175
+
176
+ });
177
+ ```
178
+
179
+
180
+ # Build from Source
181
+
182
+ ```
183
+ git clone https://github.com/subchen/angular-async-loader.git
184
+
185
+ cd angular-async-loader
186
+
187
+ npm run build
188
+ npm start
189
+
190
+ open browser http://localhost:3000/
191
+ ```
192
+
147
193
# License
148
194
149
195
Released under the [ Apache 2 License] ( http://www.apache.org/licenses/LICENSE-2.0 ) .
150
196
151
197
```
152
- Copyright 2015 Guoqiang Chen
198
+ Copyright 2015-2016 Guoqiang Chen
153
199
154
200
Licensed under the Apache License, Version 2.0 (the "License");
155
201
you may not use this file except in compliance with the License.
0 commit comments