diff --git a/CHANGELOG.md b/CHANGELOG.md
index ccb7547bba12..640f797b1f9e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,67 @@
+
+# 2.0.0-beta.0 somnambulant-inauguration (2015-12-15)
+
+**Enjoy!**
+
+
+
+# 2.0.0-alpha.55 (2015-12-15)
+
+
+### Bug Fixes
+
+* **router:** export ROUTER_LINK_DSL_PROVIDER and hide MockPopStateEvent ([fc75220](https://github.com/angular/angular/commit/fc75220))
+
+### Features
+
+* **core:** enable dev mode by default ([3dca9d5](https://github.com/angular/angular/commit/3dca9d5))
+
+
+### BREAKING CHANGES
+
+* Before
+Previously Angular would run in dev prod mode by default, and you could enable the dev mode by calling enableDevMode.
+After
+Now, Angular runs in the dev mode by default, and you can enable the prod mode by calling enableProdMode.
+
+
+
+
+# 2.0.0-alpha.54 (2015-12-15)
+
+
+### Bug Fixes
+
+* **bundles:** don't include RxJS in System.register bundles ([77b7cae](https://github.com/angular/angular/commit/77b7cae))
+* **bundles:** remove ngUpgrade from the angular2.js bundle ([283962f](https://github.com/angular/angular/commit/283962f)), closes [#5739](https://github.com/angular/angular/issues/5739) [#5854](https://github.com/angular/angular/issues/5854)
+* **bundles:** remove polyfills from angular2.js bundle ([2983558](https://github.com/angular/angular/commit/2983558)), closes [#5881](https://github.com/angular/angular/issues/5881)
+* **bundles:** rename the testing.js bundle to testing.dev.js ([d55655f](https://github.com/angular/angular/commit/d55655f)), closes [#5899](https://github.com/angular/angular/issues/5899) [#5776](https://github.com/angular/angular/issues/5776)
+* **bundles:** rename UMD bundles ([61b9468](https://github.com/angular/angular/commit/61b9468)), closes [#5898](https://github.com/angular/angular/issues/5898)
+
+
+### BREAKING CHANGES
+
+* System.register testing bundle was renamed:
+`testing.js` -> `testing.dev.js`
+
+* UMD bundles were renamed:
+ * `angular2.umd.js` -> `angular2-all.umd.js`
+ * `angular2-testing.umd.js` -> `angular2-all-testing.umd.js`
+
+* RxJS used to be bundled with Angular 2 code and this is not the case
+any more. RxJS needs to be loaded explicitly.
+
+* Previously `angular2.js`, `angular2.min.js` and `angular2.dev.js` bundles
+would have zone.js and reflect-metadata pre-appended. New bundles don't
+contain zone.js nor reflect-metadata - those external dependencies can
+be easily loaded into a browser using `angular2-polyfills.js`
+
+* `ngUpgrade` related symbols are no longer part of the `angular2.js`
+bundle. `ngUpgrade` has a dedicated `upgrade.js` bundle now.
+
+
+
+
# 2.0.0-alpha.53 (2015-12-13)
@@ -90,7 +154,7 @@ Use imports from `angular2/compiler` instead.
`,
-
+
```
The full migration instruction can be found at [angular2/docs/migration/kebab-case.md](https://github.com/angular/angular/blob/master/modules/angular2/docs/migration/kebab-case.md).
@@ -259,9 +323,9 @@ import * as core from 'angular2/core';
* Operators and Observables from RxJS (e.g. .map(), .toArray(), .toPromise(), etc ) now need to be explicitly imported (once per operator in your app)
```
- import {Observable} from 'angular2/angular2'
- import 'rxjs/operators/map';
- import 'rxjs/observable/interval'
+ import {Observable} from 'rxjs/Observable';
+ import 'rxjs/add/operators/map';
+ import 'rxjs/add/observable/interval';
Observable.interval(1000).subscribe(...);
diff --git a/COMMITTER.md b/COMMITTER.md
index 851237eb6ebf..ef408a6c6a47 100644
--- a/COMMITTER.md
+++ b/COMMITTER.md
@@ -11,8 +11,11 @@ Someone with committer access will do the rest.
We have automated the process for merging pull requests into master. Our goal is to minimize the disruption for
Angular committers and also prevent breakages on master.
-When a PR is ready to merge, a project member in the CoreTeamMember list (see below) can add the special label,
-`PR: merge`.
+When a PR has `pr_state: LGTM` and is ready to merge, you should add the `pr_action: merge` label.
+Currently (late 2015), we need to ensure that each PR will cleanly merge into the Google-internal version control,
+so the caretaker reviews the changes manually.
+
+After this review, the caretaker adds `zomg_admin: do_merge` which is restricted to admins only.
A robot running as [mary-poppins](https://github.com/mary-poppins)
is notified that the label was added by an authorized person,
and will create a new branch in the angular project, using the convention `presubmit-{username}-pr-{number}`.
@@ -26,6 +29,6 @@ Finally, after merge `mary-poppins` removes the presubmit branch.
## Administration
-The list of users who can trigger a merge by adding the label is stored in our appengine app datastore.
+The list of users who can trigger a merge by adding the `zomg_admin: do_merge` label is stored in our appengine app datastore.
Edit the contents of the [CoreTeamMember Table](
https://console.developers.google.com/project/angular2-automation/datastore/query?queryType=KindQuery&namespace=&kind=CoreTeamMember)
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index e22ad4831f33..b8da1f04776b 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -48,14 +48,18 @@ features, by not reporting duplicate issues. Providing the following informatio
chances of your issue being dealt with quickly:
* **Overview of the Issue** - if an error is being thrown a non-minified stack trace helps
-* **Motivation for or Use Case** - explain why this is a bug for you
+* **Angular Version** - what version of Angular is affected (e.g. 2.0.0-alpha.53)
+* **Motivation for or Use Case** - explain what are you trying to do and why the current behavior is a bug for you
* **Browsers and Operating System** - is this a problem with all browsers?
* **Reproduce the Error** - provide a live example (using [Plunker][plunker],
- [JSFiddle][jsfiddle] or [Runnable][runnable]) or a unambiguous set of steps.
+ [JSFiddle][jsfiddle] or [Runnable][runnable]) or a unambiguous set of steps
* **Related Issues** - has a similar issue been reported before?
* **Suggest a Fix** - if you can't fix the bug yourself, perhaps you can point to what might be
causing the problem (line of code or commit)
+You can file new issues by providing the above information [here](https://github.com/angular/angular/issues/new).
+
+
### Submitting a Pull Request (PR)
Before you submit your Pull Request (PR) consider the following guidelines:
diff --git a/README.md b/README.md
index a4d10c98ab80..1ec98bd96abf 100644
--- a/README.md
+++ b/README.md
@@ -12,20 +12,12 @@ Angular
Angular is a development platform for building mobile and desktop web applications. This is the
repository for [Angular 2][ng2], both the JavaScript (JS) and [Dart][dart] versions.
-Angular 2 is currently in **Developer Preview**. We recommend using Angular 1.X for production
-applications:
-
-* [AngularJS][ngJS]: [angular/angular.js](http://github.com/angular/angular.js).
-* [AngularDart][ngDart]: [angular/angular.dart](http://github.com/angular/angular.dart).
+Angular 2 is currently in **Beta**.
## Quickstart
[Get started in 5 minutes][quickstart].
-## Setup & Install Angular 2
-
-Follow the instructions given on the [Angular download page][download].
-
## Want to help?
@@ -36,8 +28,7 @@ guidelines for [contributing][contributing] and then check out one of our issues
[contributing]: http://github.com/angular/angular/blob/master/CONTRIBUTING.md
[dart]: http://www.dartlang.org
[dartium]: http://www.dartlang.org/tools/dartium
-[download]: http://angular.io/download/
-[quickstart]: https://angular.io/docs/js/latest/quickstart.html
+[quickstart]: https://angular.io/docs/ts/latest/quickstart.html
[ng2]: http://angular.io
[ngDart]: http://angulardart.org
[ngJS]: http://angularjs.org
diff --git a/TOOLS_DART.md b/TOOLS_DART.md
index 6eb34fe9a025..c61b97c25d87 100644
--- a/TOOLS_DART.md
+++ b/TOOLS_DART.md
@@ -21,7 +21,7 @@ By default the debugging tools are disabled.
Enable the debugging tools as follows:
```dart
-import 'package:angular2/tools.dart';
+import 'package:angular2/platform/browser.dart';
main() async {
var appRef = await bootstrap(Application);
diff --git a/clone.git b/clone.git
new file mode 100644
index 000000000000..ab1b40bb2521
--- /dev/null
+++ b/clone.git
@@ -0,0 +1,10 @@
+$ git clone --bare https://github.com/angular/angular.git
+# Make a bare clone of the repository
+
+$ cd old-repository.git
+$ git push --mirror https://github.com/usernamealreadyis/commands.git
+# Mirror-push to the new repository
+
+$ cd ..
+$ rm -rf old-repository.git
+# Remove our temporary local repository
diff --git a/gulpfile.js b/gulpfile.js
index 69a5cc057cc0..fc8f207995f2 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -150,14 +150,14 @@ var ANGULAR2_BUNDLE_CONFIG = [
'angular2/platform/common_dom'
];
-var NG2_BUNDLE_CONTENT = ANGULAR2_BUNDLE_CONFIG.join(' + ');
-var HTTP_BUNDLE_CONTENT = 'angular2/http - ' + ANGULAR2_BUNDLE_CONFIG.join(' - ');
-var ROUTER_BUNDLE_CONTENT =
- 'angular2/router + angular2/router/router_link_dsl - ' + ANGULAR2_BUNDLE_CONFIG.join(' - ');
+var NG2_BUNDLE_CONTENT = ANGULAR2_BUNDLE_CONFIG.join(' + ') + ' - rxjs/*';
+var HTTP_BUNDLE_CONTENT = 'angular2/http - rxjs/* - ' + ANGULAR2_BUNDLE_CONFIG.join(' - ');
+var ROUTER_BUNDLE_CONTENT = 'angular2/router + angular2/router/router_link_dsl - rxjs/* - ' +
+ ANGULAR2_BUNDLE_CONFIG.join(' - ');
var TESTING_BUNDLE_CONTENT =
- 'angular2/testing + angular2/http/testing + angular2/router/testing - ' +
+ 'angular2/testing + angular2/http/testing + angular2/router/testing - rxjs/* - ' +
ANGULAR2_BUNDLE_CONFIG.join(' - ');
-var UPGRADE_BUNDLE_CONTENT = 'angular2/upgrade - ' + ANGULAR2_BUNDLE_CONFIG.join(' - ');
+var UPGRADE_BUNDLE_CONTENT = 'angular2/upgrade - rxjs/* - ' + ANGULAR2_BUNDLE_CONFIG.join(' - ');
var BENCHPRESS_BUNDLE_CONFIG = {
entries: ['./dist/js/cjs/benchpress/index.js'],
@@ -638,7 +638,7 @@ gulp.task('test.unit.dart', function(done) {
// This test will fail if the size of our hello_world app goes beyond one of
// these values when compressed at the specified level.
// Measure in bytes.
-var _DART_PAYLOAD_SIZE_LIMITS = {'uncompressed': 375 * 1024, 'gzip level=6': 105 * 1024};
+var _DART_PAYLOAD_SIZE_LIMITS = {'uncompressed': 320 * 1024, 'gzip level=6': 90 * 1024};
gulp.task('test.payload.dart/ci', function(done) {
runSequence('build/packages.dart', '!pubget.payload.dart', '!pubbuild.payload.dart',
'!checkAndReport.payload.dart', done);
@@ -1109,10 +1109,14 @@ gulp.task('!bundle.testing', ['build.js.dev'], function() {
var devBundleConfig = merge(true, bundleConfig);
devBundleConfig.paths = merge(true, devBundleConfig.paths, {"*": "dist/js/dev/es5/*.js"});
- return bundler.bundle(devBundleConfig, TESTING_BUNDLE_CONTENT, './dist/js/bundle/testing.js',
+ return bundler.bundle(devBundleConfig, TESTING_BUNDLE_CONTENT, './dist/js/bundle/testing.dev.js',
{sourceMaps: true});
});
+gulp.task('!bundles.js.docs', function() {
+ gulp.src('modules/angular2/docs/bundles/*').pipe(gulp.dest('dist/js/bundle'));
+});
+
gulp.task('!bundles.js.umd', ['build.js.dev'], function() {
var q = require('q');
var webpack = q.denodeify(require('webpack'));
@@ -1139,15 +1143,45 @@ gulp.task('!bundles.js.umd', ['build.js.dev'], function() {
resolve: resolveOptions(devOrProd),
module: {preLoaders: [{test: /\.js$/, loader: 'source-map-loader'}]},
devtool: devOrProd === 'dev' ? 'inline-source-map' : undefined,
- output: outputOptions(outFileName, devOrProd)
+ output: outputOptions(outFileName, devOrProd),
+ externals: {
+ 'rxjs/Observable': 'umd Rx',
+ 'rxjs/Subject': 'umd Rx',
+ 'rxjs/subject/ReplaySubject': {
+ commonjs: 'rxjs/subject/ReplaySubject',
+ commonjs2: 'rxjs/subject/ReplaySubject',
+ amd: 'rxjs/subject/ReplaySubject',
+ root: ['Rx']
+ },
+ 'rxjs/operator/take': {
+ commonjs: 'rxjs/operator/take',
+ commonjs2: 'rxjs/operator/take',
+ amd: 'rxjs/operator/take',
+ root: ['Rx', 'Observable', 'prototype']
+ },
+ 'rxjs/observable/fromPromise': {
+ commonjs: 'rxjs/observable/fromPromise',
+ commonjs2: 'rxjs/observable/fromPromise',
+ amd: 'rxjs/observable/fromPromise',
+ root: ['Rx', 'Observable']
+ },
+ 'rxjs/operator/toPromise': {
+ commonjs: 'rxjs/operator/toPromise',
+ commonjs2: 'rxjs/operator/toPromise',
+ amd: 'rxjs/operator/toPromise',
+ root: ['Rx', 'Observable', 'prototype']
+ }
+ }
};
}
return q.all([
- webpack(webPackConf([__dirname + '/tools/build/webpack/angular2.umd.js'], 'angular2', 'dev')),
- webpack(webPackConf([__dirname + '/tools/build/webpack/angular2.umd.js'], 'angular2', 'prod')),
- webpack(webPackConf([__dirname + '/tools/build/webpack/angular2-testing.umd.js'],
- 'angular2-testing', 'dev'))
+ webpack(webPackConf([__dirname + '/tools/build/webpack/angular2-all.umd.js'], 'angular2-all',
+ 'dev')),
+ webpack(webPackConf([__dirname + '/tools/build/webpack/angular2-all.umd.js'], 'angular2-all',
+ 'prod')),
+ webpack(webPackConf([__dirname + '/tools/build/webpack/angular2-all-testing.umd.js'],
+ 'angular2-all-testing', 'dev'))
]);
});
@@ -1156,7 +1190,7 @@ gulp.task('bundles.js.umd.min', ['!bundles.js.umd', '!bundle.ng.polyfills'], fun
var uglify = require('gulp-uglify');
// minify production bundles
- return gulp.src(['dist/js/bundle/angular2-polyfills.js', 'dist/js/bundle/angular2.umd.js'])
+ return gulp.src(['dist/js/bundle/angular2-polyfills.js', 'dist/js/bundle/angular2-all.umd.js'])
.pipe(uglify())
.pipe(rename({extname: '.min.js'}))
.pipe(gulp.dest('dist/js/bundle'));
@@ -1195,25 +1229,12 @@ var JS_DEV_DEPS = [
'node_modules/reflect-metadata/Reflect.js'
];
-// Splice in RX license if rx is in the bundle.
-function insertRXLicense(source) {
- var n = source.indexOf('System.register("rxjs/Subject"');
- if (n >= 0) {
- // TODO: point this to Rx once Rx includes license in dist
- // https://github.com/angular/angular/issues/5558
- var rxLicense = licenseWrap('LICENSE');
- return source.slice(0, n) + rxLicense + source.slice(n);
- } else {
- return source;
- }
-}
function addDevDependencies(outputFile) {
var bundler = require('./tools/build/bundle');
var insert = require('gulp-insert');
return bundler.modify(JS_DEV_DEPS.concat(['dist/build/' + outputFile]), outputFile)
- .pipe(insert.transform(insertRXLicense))
.pipe(gulp.dest('dist/js/bundle'));
}
@@ -1252,7 +1273,8 @@ gulp.task('bundles.js',
'!bundle.web_worker.js.dev.deps',
'bundles.js.umd.min',
'!bundle.testing',
- '!bundle.ng.polyfills'
+ '!bundle.ng.polyfills',
+ '!bundles.js.docs'
],
function(done) { runSequence('!bundle.copy', '!bundles.js.checksize', done); });
diff --git a/modules/angular1_router/lib/facades.es5 b/modules/angular1_router/lib/facades.es5
index b82d19805625..f419cdef5ff5 100644
--- a/modules/angular1_router/lib/facades.es5
+++ b/modules/angular1_router/lib/facades.es5
@@ -195,6 +195,10 @@ var ListWrapper = {
return array[0];
},
+ last: function(array) {
+ return (array && array.length) > 0 ? array[array.length - 1] : null;
+ },
+
map: function (l, fn) {
return l.map(fn);
},
diff --git a/modules/angular2/core.dart b/modules/angular2/core.dart
index 187285742e17..2e43211bd5fa 100644
--- a/modules/angular2/core.dart
+++ b/modules/angular2/core.dart
@@ -2,7 +2,7 @@ library angular2.core;
export './src/core/metadata.dart';
export './src/core/util.dart';
-export './src/core/dev_mode.dart';
+export 'package:angular2/src/facade/lang.dart' show enableProdMode;
export './src/core/di.dart' hide ForwardRefFn, resolveForwardRef, forwardRef;
export './src/facade/facade.dart';
export './src/core/application_ref.dart' show platform, createNgZone, PlatformRef, ApplicationRef;
diff --git a/modules/angular2/core.ts b/modules/angular2/core.ts
index 25d31ebb2e91..08f3d19d5416 100644
--- a/modules/angular2/core.ts
+++ b/modules/angular2/core.ts
@@ -5,9 +5,10 @@
*/
export * from './src/core/metadata';
export * from './src/core/util';
-export * from './src/core/dev_mode';
+export * from './src/core/prod_mode';
export * from './src/core/di';
export * from './src/facade/facade';
+export {enableProdMode} from 'angular2/src/facade/lang';
export {platform, createNgZone, PlatformRef, ApplicationRef} from './src/core/application_ref';
export {
APP_ID,
diff --git a/modules/angular2/docs/bundles/overview.md b/modules/angular2/docs/bundles/overview.md
new file mode 100644
index 000000000000..25dd4b9d465c
--- /dev/null
+++ b/modules/angular2/docs/bundles/overview.md
@@ -0,0 +1,92 @@
+# TL;DR;
+
+* If you write ES5 use _one_ of the `UMD` bundles.
+* If you experiment with Angular2 using online prototyping tools like [plnkr](http://plnkr.co/) or similar use `System.register` bundles with SystemJS loader.
+* If you use build tools like Browserify or WebPack - bundle Angular2 as part of your build.
+* For all the above cases you must use `angular2-polyfills.js` in a `script` tag to easily include polyfills and external dependencies.
+
+# Modules, barrels and bundles
+
+Angular2 source code is authored using the ES2015 standardized module format where one module corresponds to exactly one file. Multiple modules (files) can be logically grouped into so-called "barrels".
+ A bundle is a file the contains all the code for one or more barrels.
+
+Most bundles come in several flavors:
+* regular and minified (got `.min` in their name);
+* regular and "development" (have `.dev` in their name) - "development" bundles contain in-line source maps and don't have minified flavor (minification removes in-lined source maps).
+
+# Bundles, their content and usage scenarios
+
+Angular 2 distributes several types of bundles targeted at specific usages:
+ * users writing ES5 code without any transpilation steps
+ * users experimenting with Angular 2 and TypeScript/ES2015 using online tools like plunker, jsbin or similar
+
+Since each identified scenario has slightly different requirements and constraints there are specific bundles for each use-case.
+
+## ES5 and ngUpgrade users
+
+ES5 users and AngularJS 1.x users interested in the `ngUpgrade` path can take advantage of the bundles in the [UMD format](https://github.com/umdjs/umd).
+ Those are coarse-grained bundles that combine many barrels in one final file.
+
+filename | list of barrels | dev/prod | minified?
+------------|-------------------|----------|-------------|--------------|-------------
+`angular2-all.umd.js` | `angular2/core`, `angular2/common`, `angular2/compiler`, `angular2/platform/browser`, `angular2/platform/common_dom`, `angular2/http`, `angular2/router`, `angular2/instrumentation`, `angular2/upgrade`| prod | no
+`angular2-all.umd.min.js` | `angular2/core`, `angular2/common`, `angular2/compiler`, `angular2/platform/browser`, `angular2/platform/common_dom`, `angular2/http`, `angular2/router`, `angular2/instrumentation`, `angular2/upgrade` | prod | yes
+`angular2-all.umd.dev.js` | `angular2/core`, `angular2/common`, `angular2/compiler`, `angular2/platform/browser`, `angular2/platform/common_dom`, `angular2/http`, `angular2/router`, `angular2/instrumentation`, `angular2/upgrade` | dev | no
+`angular2-all-testing.umd.dev.js` | `angular2/core`, `angular2/common`, `angular2/compiler`, `angular2/platform/browser`, `angular2/platform/common_dom`, `angular2/http`, `angular2/router`, `angular2/instrumentation`, `angular2/upgrade`, `angular2/testing`, `angular2/http/testing`, `angular2/router/testing` | dev | no
+
+**Warning**: bundles in the `UMD` format are _not_ "additive". A single application should use only one bundle from the above list.
+
+## SystemJS loader users
+
+[SystemJS loader](https://github.com/systemjs/systemjs) with on-the-fly (in a browser) transpilations support is very useful for quick experiments using tools like plunker, jsbin or similar.
+For this scenario Angular 2 is distributed with bundles in the [System.register format](https://github.com/ModuleLoader/es6-module-loader/wiki/System.register-Explained):
+
+filename | list of barrels | dev/prod | minified?
+------------|-------------------|----------|-------------|--------------|-------------
+`angular2.js` | `angular2/core`, `angular2/common`, `angular2/compiler`, `angular2/platform/browser`, `angular2/platform/common_dom`, `angular2/instrumentation`| prod | no
+`angular2.min.js` | `angular2/core`, `angular2/common`, `angular2/compiler`, `angular2/platform/browser`, `angular2/platform/common_dom`, `angular2/instrumentation`| prod | yes
+`angular2.dev.js` | `angular2/core`, `angular2/common`, `angular2/compiler`, `angular2/platform/browser`, `angular2/platform/common_dom`, `angular2/instrumentation`| dev | no
+`http.js` | `angular2/http` | prod | no
+`http.min.js` | `angular2/http` | prod | yes
+`http.dev.js` | `angular2/http` | dev | no
+`router.js` | `angular2/router` | prod | no
+`router.min.js` | `angular2/router` | prod | yes
+`router.dev.js` | `angular2/router` | dev | no
+`upgrade.js` | `angular2/upgrade` | prod | no
+`upgrade.min.js` | `angular2/upgrade` | prod | yes
+`upgrade.dev.js` | `angular2/upgrade` | dev | no
+`testing.dev.js` | `angular2/testing`, `angular2/http/testing`, `angular2/router/testing` | dev | no
+
+**Note**: bundles in the `System.register` format are "additive" - it is quite common to include several bundles in one application.
+For example people using Angular 2 with `http` and `router` would include: `angular2.js`, `http.js` and `router.js`.
+
+## Browserify / JSPM / Rollup / WebPack users
+
+Angular 2 doesn't provide any bundles for use with packaging tools Browserify or WebPack. Those tools are sophisticated enough to build optimal bundles for production use from individual Angular 2 files distributed in the npm package.
+An example of an Angular 2 project built with WebPack can be found in the [angular2-seed](https://github.com/angular/angular2-seed) repository.
+
+
+# Polyfills and external dependencies
+
+## Required Polyfills
+
+Polyfills are required for Angular 2 to function properly (the exact list depends on the browser used) and external dependencies ([zone.js](https://github.com/angular/zone.js)).
+To ease setup of Angular 2 applications there is one file - `angular2-polyfills.js` - that combines:
+* a pollyfill mandatory for all browsers: [reflect-metadata](https://www.npmjs.com/package/reflect-metadata)
+* [zone.js](https://github.com/angular/zone.js)
+
+**Note**: `angular2-polyfills.js` contains code that should be loaded into the browser as the very first code of the web application even before the module loader. The preferred solution is to load the mentioned file in a `script` tag as early as possible.
+
+
+## RxJS
+
+[RxJS](https://github.com/ReactiveX/RxJS) is a required dependency of Angular 2.
+
+You should include RxJS in your project by declaring a dependency on the [`rxjs` npm package](https://www.npmjs.com/package/rxjs).
+
+Depending on if you are using Angular bundles or not you can either use RxJS bundles from `node_modules/rxjs/bundles/` or configure your bundler to pull in the individual files from the npm package.
+
+
+## ES6 shims (optional)
+
+Users of pre-ES6 browsers might need to add an ES6 shim (e.g. [es6-shim](https://github.com/paulmillr/es6-shim))
\ No newline at end of file
diff --git a/modules/angular2/docs/cheatsheet/bootstrapping.md b/modules/angular2/docs/cheatsheet/bootstrapping.md
index 5859e9b5f81f..99fba2b5c0b1 100644
--- a/modules/angular2/docs/cheatsheet/bootstrapping.md
+++ b/modules/angular2/docs/cheatsheet/bootstrapping.md
@@ -2,12 +2,17 @@
Bootstrapping
@cheatsheetIndex 0
@description
-{@target js ts}`import {bootstrap} from 'angular2/platform/browser';`{@endtarget}
+{@target ts}`import {bootstrap} from 'angular2/angular2';`{@endtarget}
+{@target js}Available from the `ng.platform.browser` namespace.{@endtarget}
{@target dart}`import 'package:angular2/bootstrap.dart';`{@endtarget}
@cheatsheetItem
-syntax:
+syntax(ts dart):
`bootstrap​(MyAppComponent, [MyService, provide(...)]);`|`provide`
+syntax(js):
+`document.addEventListener('DOMContentLoaded', function () {
+ ng.platform.browser.bootstrap(MyAppComponent,
+ [MyService, ng.core.provide(...)]);
+});`|`provide`
description:
-Bootstraps an application with MyAppComponent as the root component, and
-configures the app's dependency injection providers.
+Bootstraps an application with MyAppComponent as the root component and configures the DI providers. {@target js}Must be wrapped in the event listener to fire when the page loads.{@endtarget}
diff --git a/modules/angular2/docs/cheatsheet/built-in-directives.md b/modules/angular2/docs/cheatsheet/built-in-directives.md
index 126578e55c80..9e5ebee575f8 100644
--- a/modules/angular2/docs/cheatsheet/built-in-directives.md
+++ b/modules/angular2/docs/cheatsheet/built-in-directives.md
@@ -2,7 +2,8 @@
Built-in directives
@cheatsheetIndex 2
@description
-{@target js ts}`import {NgIf, ...} from 'angular2/common';`{@endtarget}
+{@target ts}`import {NgIf, ...} from 'angular2/common';`{@endtarget}
+{@target js}Available from the `ng.common` namespace{@endtarget}
{@target dart}`import 'package:angular2/common.dart';`{@endtarget}
@cheatsheetItem
diff --git a/modules/angular2/docs/cheatsheet/class-decorators.md b/modules/angular2/docs/cheatsheet/class-decorators.md
index af449c8b80e8..e1862e764e73 100644
--- a/modules/angular2/docs/cheatsheet/class-decorators.md
+++ b/modules/angular2/docs/cheatsheet/class-decorators.md
@@ -2,13 +2,16 @@
Class decorators
@cheatsheetIndex 4
@description
-{@target js ts}`import {Directive, ...} from 'angular2/core';`{@endtarget}
+{@target ts}`import {Directive, ...} from 'angular2/core';`{@endtarget}
+{@target js}Available from the `ng.core` namespace{@endtarget}
{@target dart}`import 'package:angular2/core.dart';`{@endtarget}
@cheatsheetItem
-syntax(js ts):
+syntax(ts):
`@Component({...})
class MyComponent() {}`|`@Component({...})`
+syntax(js):
+`var MyComponent = ng.core.Component({...}).Class({...})`|`ng.core.Component({...})`
syntax(dart):
`@Component(...)
class MyComponent() {}`|`@Component(...)`
@@ -16,9 +19,11 @@ description:
Declares that a class is a component and provides metadata about the component.
@cheatsheetItem
-syntax(js ts):
+syntax(ts):
`@Pipe({...})
class MyPipe() {}`|`@Pipe({...})`
+syntax(js):
+`var MyPipe = ng.core.Pipe({...}).Class({...})`|`ng.core.Pipe({...})`
syntax(dart):
`@Pipe(...)
class MyPipe() {}`|`@Pipe(...)`
@@ -26,12 +31,18 @@ description:
Declares that a class is a pipe and provides metadata about the pipe.
@cheatsheetItem
-syntax(js ts):
+syntax(ts):
`@Injectable()
class MyService() {}`|`@Injectable()`
+syntax(js):
+`var OtherService = ng.core.Class({constructor: function() { }});
+var MyService = ng.core.Class({constructor: [OtherService, function(otherService) { }]});`|`var MyService = ng.core.Class({constructor: [OtherService, function(otherService) { }]});`
syntax(dart):
`@Injectable()
class MyService() {}`|`@Injectable()`
description:
-Declares that a class has dependencies that should be injected into the constructor when the dependency
-injector is creating an instance of this class.
+{@target ts dart}Declares that a class has dependencies that should be injected into the constructor when the dependency injector is creating an instance of this class.
+{@endtarget}
+{@target js}
+Declares a service to inject into a class by providing an array with the services with the final item being the function which will receive the injected services.
+{@endtarget}
diff --git a/modules/angular2/docs/cheatsheet/component-configuration.md b/modules/angular2/docs/cheatsheet/component-configuration.md
index 81765661090f..64d48c0f4e04 100644
--- a/modules/angular2/docs/cheatsheet/component-configuration.md
+++ b/modules/angular2/docs/cheatsheet/component-configuration.md
@@ -2,12 +2,16 @@
Component configuration
@cheatsheetIndex 6
@description
-`@Component` extends `@Directive`,
-so the `@Directive` configuration applies to components as well
+{@target js}`ng.core.Component` extends `ng.core.Directive`,
+so the `ng.core.Directive` configuration applies to components as well{@endtarget}
+{@target ts dart}`@Component` extends `@Directive`,
+so the `@Directive` configuration applies to components as well{@endtarget}
@cheatsheetItem
-syntax:
+syntax(ts dart):
`viewProviders: [MyService, provide(...)]`|`viewProviders:`
+syntax(js):
+`viewProviders: [MyService, ng.core.provide(...)]`|`viewProviders:`
description:
Array of dependency injection providers scoped to this component's view.
diff --git a/modules/angular2/docs/cheatsheet/dependency-injection.md b/modules/angular2/docs/cheatsheet/dependency-injection.md
index ed6426d94f85..83c1c0d291e2 100644
--- a/modules/angular2/docs/cheatsheet/dependency-injection.md
+++ b/modules/angular2/docs/cheatsheet/dependency-injection.md
@@ -2,26 +2,32 @@
Dependency injection configuration
@cheatsheetIndex 9
@description
-{@target js ts}`import {provide} from 'angular2/core';`{@endtarget}
+{@target ts}`import {provide} from 'angular2/core';`{@endtarget}
+{@target js}Available from the `ng.core` namespace{@endtarget}
{@target dart}`import 'package:angular2/core.dart';`{@endtarget}
@cheatsheetItem
-syntax:
+syntax(ts dart):
`provide(MyService, {useClass: MyMockService})`|`provide`|`useClass`
+syntax(js):
+`ng.core.provide(MyService, {useClass: MyMockService})`|`provide`|`useClass`
description:
Sets or overrides the provider for MyService to the MyMockService class.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`provide(MyService, {useFactory: myFactory})`|`provide`|`useFactory`
+syntax(js):
+`ng.core.provide(MyService, {useFactory: myFactory})`|`provide`|`useFactory`
description:
Sets or overrides the provider for MyService to the myFactory factory function.
@cheatsheetItem
-syntax:
+syntax(ts dart):
+`provide(MyValue, {useValue: 41})`|`provide`|`useValue`
+syntax(js):
`provide(MyValue, {useValue: 41})`|`provide`|`useValue`
description:
Sets or overrides the provider for MyValue to the value 41.
-
diff --git a/modules/angular2/docs/cheatsheet/directive-and-component-decorators.md b/modules/angular2/docs/cheatsheet/directive-and-component-decorators.md
index 4de517b3d3ae..dcfe62e7555c 100644
--- a/modules/angular2/docs/cheatsheet/directive-and-component-decorators.md
+++ b/modules/angular2/docs/cheatsheet/directive-and-component-decorators.md
@@ -2,62 +2,79 @@
Class field decorators for directives and components
@cheatsheetIndex 7
@description
-{@target js ts}`import {Input, ...} from 'angular2/core';`{@endtarget}
+{@target ts}`import {Input, ...} from 'angular2/core';`{@endtarget}
+{@target js}Available from the `ng.core` namespace{@endtarget}
{@target dart}`import 'package:angular2/core.dart';`{@endtarget}
@cheatsheetItem
-syntax:
+syntax(ts dart):
`@Input() myProperty;`|`@Input()`
+syntax(js):
+`ng.core.Input(myProperty, myComponent);`|`ng.core.Input(`|`);`
description:
Declares an input property that we can update via property binding (e.g.
``).
@cheatsheetItem
-syntax:
+syntax(ts dart):
`@Output() myEvent = new EventEmitter();`|`@Output()`
+syntax(js):
+`myEvent = new ng.core.EventEmitter(); ng.core.Output(myEvent, myComponent);`|`ng.core.Output(`|`);`
description:
Declares an output property that fires events to which we can subscribe with an event binding (e.g. ``).
@cheatsheetItem
-syntax:
+syntax(ts dart):
`@HostBinding('[class.valid]') isValid;`|`@HostBinding('[class.valid]')`
+syntax(js):
+`ng.core.HostBinding('[class.valid]', 'isValid', myComponent);`|`ng.core.HostBinding('[class.valid]', 'isValid'`|`);`
description:
Binds a host element property (e.g. CSS class valid) to directive/component property (e.g. isValid).
@cheatsheetItem
-syntax:
+syntax(ts dart):
`@HostListener('click', ['$event']) onClick(e) {...}`|`@HostListener('click', ['$event'])`
+syntax(js):
+`ng.core.HostListener('click', ['$event'], onClick(e) {...}, myComponent);`|`ng.core.HostListener('click', ['$event'], onClick(e)`|`);`
description:
Subscribes to a host element event (e.g. click) with a directive/component method (e.g. onClick), optionally passing an argument ($event).
@cheatsheetItem
-syntax:
+syntax(ts dart):
`@ContentChild(myPredicate) myChildComponent;`|`@ContentChild(myPredicate)`
+syntax(js):
+`ng.core.ContentChild(myPredicate, 'myChildComponent', myComponent);`|`ng.core.ContentChild(myPredicate,`|`);`
description:
Binds the first result of the component content query (myPredicate) to the myChildComponent property of the class.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`@ContentChildren(myPredicate) myChildComponents;`|`@ContentChildren(myPredicate)`
+syntax(js):
+`ng.core.ContentChildren(myPredicate, 'myChildComponents', myComponent);`|`ng.core.ContentChildren(myPredicate,`|`);`
description:
Binds the results of the component content query (myPredicate) to the myChildComponents property of the class.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`@ViewChild(myPredicate) myChildComponent;`|`@ViewChild(myPredicate)`
+syntax(js):
+`ng.core.ViewChild(myPredicate, 'myChildComponent', myComponent);`|`ng.core.ViewChild(myPredicate,`|`);`
description:
Binds the first result of the component view query (myPredicate) to the myChildComponent property of the class. Not available for directives.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`@ViewChildren(myPredicate) myChildComponents;`|`@ViewChildren(myPredicate)`
+syntax(js):
+`ng.core.ViewChildren(myPredicate, 'myChildComponents', myComponent);`|`ng.core.ViewChildren(myPredicate,`|`);`
description:
Binds the results of the component view query (myPredicate) to the myChildComponents property of the class. Not available for directives.
diff --git a/modules/angular2/docs/cheatsheet/directive-configuration.md b/modules/angular2/docs/cheatsheet/directive-configuration.md
index 27f90eb0d5e9..afe11a671cf6 100644
--- a/modules/angular2/docs/cheatsheet/directive-configuration.md
+++ b/modules/angular2/docs/cheatsheet/directive-configuration.md
@@ -2,7 +2,8 @@
Directive configuration
@cheatsheetIndex 5
@description
-{@target js ts}`@Directive({ property1: value1, ... })`{@endtarget}
+{@target ts}`@Directive({ property1: value1, ... })`{@endtarget}
+{@target js}`ng.core.Directive({ property1: value1, ... }).Class({...})`{@endtarget}
{@target dart}`@Directive(property1: value1, ...)`{@endtarget}
@cheatsheetItem
@@ -15,7 +16,9 @@ Specifies a CSS selector that identifies this directive within a template. Suppo
Does not support parent-child relationship selectors.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`providers: [MyService, provide(...)]`|`providers:`
+syntax(js):
+`providers: [MyService, ng.core.provide(...)]`|`providers:`
description:
Array of dependency injection providers for this directive and its children.
diff --git a/modules/angular2/docs/cheatsheet/forms.md b/modules/angular2/docs/cheatsheet/forms.md
index 30cc0c1c5258..250cd333d9fb 100644
--- a/modules/angular2/docs/cheatsheet/forms.md
+++ b/modules/angular2/docs/cheatsheet/forms.md
@@ -2,7 +2,8 @@
Forms
@cheatsheetIndex 3
@description
-{@target js ts}`import {FORM_DIRECTIVES} from 'angular2/common';`{@endtarget}
+{@target ts}`import {FORM_DIRECTIVES} from 'angular2/common';`{@endtarget}
+{@target js}Available from `ng.common.FORM_DIRECTIVES`{@endtarget}
{@target dart}`import 'package:angular2/common.dart';`{@endtarget}
@cheatsheetItem
diff --git a/modules/angular2/docs/cheatsheet/lifecycle hooks.md b/modules/angular2/docs/cheatsheet/lifecycle hooks.md
index 1ace79efe6d6..23e31fcf3ef6 100644
--- a/modules/angular2/docs/cheatsheet/lifecycle hooks.md
+++ b/modules/angular2/docs/cheatsheet/lifecycle hooks.md
@@ -2,11 +2,14 @@
Directive and component change detection and lifecycle hooks
@cheatsheetIndex 8
@description
-(implemented as class methods)
+{@target ts dart}(implemented as class methods){@endtarget}
+{@target js}(implemented as component properties){@endtarget}
@cheatsheetItem
-syntax(js ts):
+syntax(ts):
`constructor(myService: MyService, ...) { ... }`|`constructor(myService: MyService, ...)`
+syntax(js):
+`constructor: function(MyService, ...) { ... }`|`constructor: function(MyService, ...)`
syntax(dart):
`MyAppComponent(MyService myService, ...) { ... }`|`MyAppComponent(MyService myService, ...)`
description:
@@ -14,56 +17,72 @@ The class constructor is called before any other lifecycle hook. Use it to injec
@cheatsheetItem
-syntax:
+syntax(ts dart):
`ngOnChanges(changeRecord) { ... }`|`ngOnChanges(changeRecord)`
+syntax(js):
+`ngOnChanges: function(changeRecord) { ... }`|`ngOnChanges: function(changeRecord)`
description:
Called after every change to input properties and before processing content or child views.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`ngOnInit() { ... }`|`ngOnInit()`
+syntax(js):
+`ngOnInit: function() { ... }`|`ngOnInit: function()`
description:
Called after the constructor, initializing input properties, and the first call to ngOnChanges.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`ngDoCheck() { ... }`|`ngDoCheck()`
+syntax(js):
+`ngDoCheck: function() { ... }`|`ngDoCheck: function()`
description:
Called every time that the input properties of a component or a directive are checked. Use it to extend change detection by performing a custom check.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`ngAfterContentInit() { ... }`|`ngAfterContentInit()`
+syntax(js):
+`ngAfterContentInit: function() { ... }`|`ngAfterContentInit: function()`
description:
Called after ngOnInit when the component's or directive's content has been initialized.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`ngAfterContentChecked() { ... }`|`ngAfterContentChecked()`
+syntax(js):
+`ngAfterContentChecked: function() { ... }`|`ngAfterContentChecked: function()`
description:
Called after every check of the component's or directive's content.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`ngAfterViewInit() { ... }`|`ngAfterViewInit()`
+syntax(js):
+`ngAfterViewInit: function() { ... }`|`ngAfterViewInit: function()`
description:
Called after ngAfterContentInit when the component's view has been initialized. Applies to components only.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`ngAfterViewChecked() { ... }`|`ngAfterViewChecked()`
+syntax(js):
+`ngAfterViewChecked: function() { ... }`|`ngAfterViewChecked: function()`
description:
Called after every check of the component's view. Applies to components only.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`ngOnDestroy() { ... }`|`ngOnDestroy()`
+syntax(js):
+`ngOnDestroy: function() { ... }`|`ngOnDestroy: function()`
description:
Called once, before the instance is destroyed.
diff --git a/modules/angular2/docs/cheatsheet/routing.md b/modules/angular2/docs/cheatsheet/routing.md
index 7787e5243c7d..4a265897eee5 100644
--- a/modules/angular2/docs/cheatsheet/routing.md
+++ b/modules/angular2/docs/cheatsheet/routing.md
@@ -2,18 +2,27 @@
Routing and navigation
@cheatsheetIndex 10
@description
-{@target js ts}`import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, ...} from 'angular2/router';`{@endtarget}
+{@target ts}`import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, ...} from 'angular2/router';`{@endtarget}
+{@target js}Available from the `ng.router` namespace{@endtarget}
{@target dart}`import 'package:angular2/router.dart';`{@endtarget}
@cheatsheetItem
-syntax(js ts):
+syntax(ts):
`@RouteConfig([
{ path: '/:myParam', component: MyComponent, as: 'MyCmp' },
{ path: '/staticPath', component: ..., as: ...},
{ path: '/*wildCardParam', component: ..., as: ...}
])
class MyComponent() {}`|`@RouteConfig`
+syntax(js):
+`var MyComponent = ng.router.RouteConfig([
+ { path: '/:myParam', component: MyComponent, as: 'MyCmp' },
+ { path: '/staticPath', component: ..., as: ...},
+ { path: '/*wildCardParam', component: ..., as: ...}
+]).Class({
+ constructor: function() {}
+});`|`ng.router.RouteConfig`
syntax(dart):
`@RouteConfig(const [
const Route(path: '/:myParam', component: MyComponent, name: 'MyCmp' ),
@@ -37,8 +46,10 @@ Creates a link to a different view based on a route instruction consisting of a
@cheatsheetItem
-syntax(js ts):
+syntax(ts):
`@CanActivate(() => { ... })class MyComponent() {}`|`@CanActivate`
+syntax(js):
+`var MyComponent = ng.router.CanActivate(function() { ... }).Component({...}).Class({constructor: ...});`|`ng.router.CanActivate(function() { ... })`
syntax(dart):
`@CanActivate(() => ...)class MyComponent() {}`|`@CanActivate`
description:
@@ -46,35 +57,45 @@ A component decorator defining a function that the router should call first to d
@cheatsheetItem
-syntax:
+syntax(ts dart):
`routerOnActivate(nextInstruction, prevInstruction) { ... }`|`routerOnActivate`
+syntax(js):
+`routerOnActivate: function(nextInstruction, prevInstruction) { ... }`|`routerOnActivate`
description:
After navigating to a component, the router calls the component's routerOnActivate method (if defined).
@cheatsheetItem
-syntax:
+syntax(ts dart):
`routerCanReuse(nextInstruction, prevInstruction) { ... }`|`routerCanReuse`
+syntax(js):
+`routerCanReuse: function(nextInstruction, prevInstruction) { ... }`|`routerCanReuse`
description:
The router calls a component's routerCanReuse method (if defined) to determine whether to reuse the instance or destroy it and create a new instance. Should return a boolean or a {@target js ts}promise{@endtarget}{@target dart}future{@endtarget}.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`routerOnReuse(nextInstruction, prevInstruction) { ... }`|`routerOnReuse`
+syntax(js):
+`routerOnReuse: function(nextInstruction, prevInstruction) { ... }`|`routerOnReuse`
description:
The router calls the component's routerOnReuse method (if defined) when it re-uses a component instance.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`routerCanDeactivate(nextInstruction, prevInstruction) { ... }`|`routerCanDeactivate`
+syntax(js):
+`routerCanDeactivate: function(nextInstruction, prevInstruction) { ... }`|`routerCanDeactivate`
description:
The router calls the routerCanDeactivate methods (if defined) of every component that would be removed after a navigation. The navigation proceeds if and only if all such methods return true or a {@target js ts}promise that is resolved{@endtarget}{@target dart}future that completes successfully{@endtarget}.
@cheatsheetItem
-syntax:
+syntax(ts dart):
`routerOnDeactivate(nextInstruction, prevInstruction) { ... }`|`routerOnDeactivate`
+syntax(js):
+`routerOnDeactivate: function(nextInstruction, prevInstruction) { ... }`|`routerOnDeactivate`
description:
Called before the directive is removed as the result of a route change. May return a {@target js ts}promise{@endtarget}{@target dart}future{@endtarget} that pauses removing the directive until the {@target js ts}promise resolves{@endtarget}{@target dart}future completes{@endtarget}.
diff --git a/modules/angular2/docs/cheatsheet/template-syntax.md b/modules/angular2/docs/cheatsheet/template-syntax.md
index 6a8c3f8f7a91..6868f65bacd0 100644
--- a/modules/angular2/docs/cheatsheet/template-syntax.md
+++ b/modules/angular2/docs/cheatsheet/template-syntax.md
@@ -62,10 +62,10 @@ Creates a local variable `movieplayer` that provides access to the `video` eleme
@cheatsheetItem
syntax:
-`
...
`|`*my-unless`
+`
...
`|`*myUnless`
description:
The `*` symbol means that the current element will be turned into an embedded template. Equivalent to:
-`