X Tutup
Skip to content

Commit 5143e7b

Browse files
mheverymhevery
committed
feat(module): new module loader
1 parent afd2544 commit 5143e7b

File tree

211 files changed

+1051
-1242
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

211 files changed

+1051
-1242
lines changed

‎Rakefile‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,27 @@ task :compile => [:init, :compile_scenario, :compile_jstd_scenario_adapter] do
109109
--js_output_file #{path_to('angular.min.js')})
110110

111111
FileUtils.cp_r 'i18n/locale', path_to('i18n')
112+
113+
File.open(path_to('angular-loader.js'), 'w') do |f|
114+
concat = 'cat ' + [
115+
'src/loader.prefix',
116+
'src/loader.js',
117+
'src/loader.suffix'].flatten.join(' ')
118+
119+
content = %x{#{concat}}.
120+
gsub('"NG_VERSION_FULL"', NG_VERSION.full).
121+
gsub(/^\s*['"]use strict['"];?\s*$/, '') # remove all file-specific strict mode flags
122+
123+
f.write(content)
124+
end
125+
126+
%x(java -jar lib/closure-compiler/compiler.jar \
127+
--compilation_level SIMPLE_OPTIMIZATIONS \
128+
--language_in ECMASCRIPT5_STRICT \
129+
--js #{path_to('angular-loader.js')} \
130+
--js_output_file #{path_to('angular-loader.min.js')})
131+
132+
112133
end
113134

114135

@@ -134,7 +155,9 @@ task :package => [:clean, :compile, :docs] do
134155

135156
['src/angular-mocks.js',
136157
path_to('angular.js'),
158+
path_to('angular-loader.js'),
137159
path_to('angular.min.js'),
160+
path_to('angular-loader.min.js'),
138161
path_to('angular-scenario.js'),
139162
path_to('jstd-scenario-adapter.js'),
140163
path_to('jstd-scenario-adapter-config.js'),

‎angularFiles.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
angularFiles = {
22
'angularSrc': [
33
'src/Angular.js',
4+
'src/loader.js',
45
'src/AngularPublic.js',
56
'src/JSON.js',
67
'src/Injector.js',

‎docs/content/api/angular.module.ngdoc‎

Lines changed: 0 additions & 54 deletions
This file was deleted.

‎docs/content/guide/dev_guide.bootstrap.auto_bootstrap.ngdoc‎

Lines changed: 18 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -2,88 +2,33 @@
22
@name Developer Guide: Initializing Angular: Automatic Initialization
33
@description
44

5-
Angular initializes automatically when you load the angular script into your page, specifying
6-
angular's `ng:autobind` attribute with no arguments:
7-
8-
<script src="angular.js" ng:autobind>
5+
Angular initializes automatically when you load the angular script into your page that contains an element
6+
with `ng:app` directive:
7+
8+
<html ng:app>
9+
<head>
10+
<script src="angular.js"></script>
11+
</head>
12+
<body>
13+
I can add: {{ 1+2 }}.
14+
</body>
15+
</html>
916

1017
From a high-level view, this is what happens during angular's automatic initialization process:
1118

12-
1. The browser loads the page, and then runs the angular script.
13-
14-
The `ng:autobind` attribute tells angular to compile and manage the whole HTML document. The
15-
compilation phase is initiated in the page's `onLoad()` handler. Angular doesn't begin processing
16-
the page until after the page load is complete.
17-
18-
2. Angular finds the root of the HTML document and creates the global variable `angular` in the
19-
global namespace. Everything that angular subsequently creates is bound to fields in this global
20-
object.
21-
22-
3. Angular walks the DOM looking for angular widgets, directives, and markup (such as `ng:init` or
23-
`ng:repeat`). As angular encounters these, it creates child scopes as necessary and attaches them
24-
to the DOM, registers listeners on those scopes, associates any controller functions with their
25-
data and their part of the view, and ultimately constructs a runnable application. The resulting
26-
app features two-way data-binding and a nice separation between data, presentation, and business
27-
logic.
19+
1. The browser loads the page, and then runs the angular script. Angular waits for the
20+
`DOMContentLoaded` (or 'Load') event to attempt to bootstrap.
2821

29-
4. For the duration of the application session (while the page is loaded), angular monitors the
30-
state of the application, and updates the view and the data model whenever the state of either one
31-
changes.
32-
33-
For details on how the compiler works, see {@link dev_guide.compiler Angular HTML Compiler}.
22+
2. Angular looks for the `ng:app` directive. If found it then proceeds to compile the DOM element and its children.
23+
Optionally the `ng:app` may specify a {@link api/angular.module module} to load before the compilation. For details on
24+
how the compiler works, see {@link dev_guide.compiler Angular HTML Compiler}.
3425

3526

3627
## Initialization Options
3728

38-
The reason why `ng:autobind` exists is because angular should not assume that the entire HTML
29+
The reason why `ng:app` exists is because angular should not assume that the entire HTML
3930
document should be processed just because the `angular.js` script is included. In order to compile
40-
only a part of the document, specify the ID of the element you want to use for angular's root
41-
element as the value of the `ng:autobind` attribute:
42-
43-
ng:autobind="angularContent"
44-
45-
46-
## Auto-bootstrap with `#autobind`
47-
48-
In some rare cases you can't define the `ng:` prefix before the script tag's attribute (for
49-
example, in some CMS systems). In those situations it is possible to auto-bootstrap angular by
50-
appending `#autobind` to the `<script src=...>` URL, like in this snippet:
51-
52-
<pre>
53-
<!doctype html>
54-
<html>
55-
<head>
56-
<script src="http://code.angularjs.org/angular.js#autobind"></script>
57-
</head>
58-
<body>
59-
<div xmlns:ng="http://angularjs.org">
60-
Hello {{'world'}}!
61-
</div>
62-
</body>
63-
</html>
64-
</pre>
65-
66-
As with `ng:autobind`, you can specify an element id that should be exclusively targeted for
67-
compilation as the value of the `#autobind`, for example: `#autobind=angularContent`.
68-
69-
If angular.js file is being combined with other scripts into a single script file, then all of the
70-
config options above apply to this processed script as well. That means if the contents of
71-
`angular.js` were appended to `all-my-scripts.js`, then the app can be bootstrapped as:
72-
73-
<pre>
74-
<!doctype html>
75-
<html xmlns:ng="http://angularjs.org">
76-
<head>
77-
<script src="http://myapp.com/all-my-scripts.js" ng:autobind></script>
78-
</head>
79-
<body>
80-
<div>
81-
Hello {{'world'}}!
82-
</div>
83-
</body>
84-
</html>
85-
</pre>
86-
31+
only a part of the document set the `ng:app` on the root element of this portion.
8732

8833
## Global Angular Object
8934

‎docs/content/guide/dev_guide.bootstrap.manual_bootstrap.ngdoc‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ angular, but advanced users who want more control over the initialization proces
77
the manual bootstrapping method instead.
88

99
The best way to get started with manual bootstrapping is to look at the what happens when you use
10-
{@link api/angular.directive.ng:autobind ng:autobind}, by showing each step of the process
10+
{@link api/angular.directive.ng:app ng:app}, by showing each step of the process
1111
explicitly.
1212

1313
<pre>

‎docs/content/guide/dev_guide.bootstrap.ngdoc‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,20 +7,20 @@ angular should process and manage the page. To initialize angular you do the fol
77

88
* Specify the angular namespace in the `<html>` page
99
* Choose which flavor of angular script to load (debug or production)
10-
* Specify whether or not angular should process and manage the page automatically (`ng:autobind`)
10+
* Specify whether or not angular should process and manage the page automatically (`ng:app`)
1111

1212
The simplest way to initialize angular is to load the angular script and tell angular to compile
1313
and manage the whole page. You do this as follows:
1414

1515
<pre>
1616
<!doctype html>
17-
<html xmlns:ng="http://angularjs.org">
17+
<html xmlns:ng="http://angularjs.org" ng:app>
1818
<head>
1919
...
2020
</head>
2121
<body>
2222
...
23-
<script src="angular.js" ng:autobind>
23+
<script src="angular.js">
2424
</body>
2525
</pre>
2626

@@ -31,7 +31,7 @@ and manage the whole page. You do this as follows:
3131

3232
You need to declare the angular namespace declaration in the following cases:
3333

34-
* For all types of browser if you are using XHTML.
34+
* For all browsers if you are using XHTML.
3535
* For Internet Explorer older than version 9 (because older versions of IE do not render widgets
3636
properly for either HTML or XHTML).
3737

‎docs/content/guide/dev_guide.compiler.understanding_compiler.ngdoc‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,7 @@ Every {@link api/angular.widget widget}, {@link api/angular.directive directive}
66
dev_guide.compiler.markup markup} is defined with a compile function, which the angular compiler
77
executes on each widget or directive it encounters. The compile function optionally returns a link
88
function. This compilation process happens automatically when the page is loaded when you specify
9-
`ng:autobind` in the script tag from which you load the angular script file. (See {@link
10-
dev_guide.bootstrap Initializing Angular}.)
9+
`ng:app` on the root element of the application. (See {@link dev_guide.bootstrap Initializing Angular}.)
1110

1211
The compile and link functions are related as follows:
1312

‎docs/content/guide/dev_guide.di.understanding_di.ngdoc‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ events:
2626
In the illustration above, the dependency injection sequence proceeds as follows:
2727

2828
1. Service factory functions are registered with angular's service factory repository.
29-
2. `ng:autobind` triggers angular's bootstrap sequence, during which angular compiles the template,
29+
2. `ng:app` triggers angular's bootstrap sequence, during which angular compiles the template,
3030
creates the root scope, and creates the dependency injector.
3131
3. The `ng:controller` directive implicitly creates a new child scope, augmented by the application
3232
of the `PhoneListCtrl` controller function.

‎docs/content/guide/dev_guide.di.using_di_controllers.ngdoc‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,8 @@ controller from the HTML template, as follows:
2121

2222
<pre>
2323
<!doctype html>
24-
<html xmlns:ng="http://angularjs.org" ng:controller="MyController">
25-
<script src="http://code.angularjs.org/angular.min.js" ng:autobind></script>
24+
<html xmlns:ng="http://angularjs.org" ng:controller="MyController" ng:app>
25+
<script src="http://code.angularjs.org/angular.min.js"></script>
2626
<body>
2727
...
2828
</body>

‎docs/content/guide/dev_guide.forms.ngdoc‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -516,9 +516,8 @@ function LoginController() {
516516
}
517517

518518
describe('LoginController', function() {
519-
it('should disable login button when form is invalid', function() {
520-
var scope = angular.module.ng.$rootScope.Scope();
521-
var loginController = scope.$new(LoginController);
519+
it('should disable login button when form is invalid', inject(function($rootScope) {
520+
var loginController = $rootScope.$new(LoginController);
522521

523522
// In production the 'loginForm' form instance gets set from the view,
524523
// but in unit-test we have to set it manually.
@@ -533,7 +532,7 @@ describe('LoginController', function() {
533532
// Now simulate a valid form
534533
loginController.loginForm.$emit('$valid', 'MyReason');
535534
expect(loginController.disableLogin()).toBe(false);
536-
});
535+
}));
537536
});
538537
</pre>
539538

@@ -569,9 +568,8 @@ function LoginController(){
569568
}
570569

571570
describe('LoginController', function() {
572-
it('should disable login button when form is invalid', function() {
573-
var scope = angular.module.ng.$rootScope.Scope();
574-
var loginController = scope.$new(LoginController);
571+
it('should disable login button when form is invalid', inject(function($rootScope) {
572+
var loginController = $rootScope.$new(LoginController);
575573
var input = angular.element('<input>');
576574

577575
// In production the 'loginForm' form instance gets set from the view,
@@ -609,7 +607,7 @@ describe('LoginController', function() {
609607
loginController.password = 'abcdef'; // should be valid
610608
scope.$digest();
611609
expect(loginController.loginForm.password.$valid).toBe(true);
612-
});
610+
}));
613611
});
614612
</pre>
615613

0 commit comments

Comments
 (0)
X Tutup