docs(changelog): add changelog for 4.0.0-beta.3

While authoring this document we agreed to pushing off the 4.0.0 release by one week by adding one more RC week (compared to the original plan).
We announced that RC would take 1 month, but then I did the calendar math incorrectly.
This schedule change will give community more time to test the release before we call it done and report any potential regression or unforeseen issues.

.pullapprove.yml

@@ -0,0 +1,32 @@
+# Configuration for pullapprove.com
+# See ownership spreadsheet:
+# https://docs.google.com/spreadsheets/d/1-HIlzfbPYGsPr9KuYMe6bLfc4LXzPjpoALqtYRYTZB0/edit?pli=1#gid=0&vpid=A5
+
+version: 2
+
+group_defaults:
+  required: 1
+  reset_on_reopened:
+    enabled: true
+  approve_by_comment:
+    enabled: true
+    approve_regex: '^(Approved|:\+1:|LGTM)'
+
+groups:
+  config:
+    conditions:
+      files:
+        - "*.yml"
+        - "*.json"
+    teams:
+      - repoowners
+
+  compiler:
+    conditions:
+      files:
+        - "tools/@angular/tsc-wrapped/*"
+        - "modules/@angular/compiler/*"
+        - "modules/@angular/compiler-cli/*"
+    teams:
+      - compiler-owners
+      - repoowners

CHANGELOG.md

@@ -1,3 +1,127 @@
+<a name="4.0.0-beta.3"></a>
+# [4.0.0-beta.3](https://github.com/angular/angular/compare/4.0.0-beta.2...4.0.0-beta.3) (2017-01-11)
+
+
+### Bug Fixes
+
+* **compiler:** avoid evaluating arguments to unknown decorators ([d061adc](https://github.com/angular/angular/commit/d061adc)), closes [#13605](https://github.com/angular/angular/issues/13605)
+* **compiler:** fix template binding parsing (`*directive="-..."`) ([e5c6bb4](https://github.com/angular/angular/commit/e5c6bb4)), closes [#13800](https://github.com/angular/angular/issues/13800)
+* **compiler-cli:** add support for more than 2 levels of nested lazy routes ([5d9cbd7](https://github.com/angular/angular/commit/5d9cbd7)), closes [angular/angular-cli#3663](https://github.com/angular/angular-cli/issues/3663)
+* **compiler-cli:** avoid handling functions in loadChildren as lazy load routes paths ([aeed737](https://github.com/angular/angular/commit/aeed737)), closes [angular/angular-cli#3204](https://github.com/angular/angular-cli/issues/3204)
+* **core:** Add type information to  differs ([8c7e93b](https://github.com/angular/angular/commit/8c7e93b)), closes [#13382](https://github.com/angular/angular/issues/13382)
+* **i18n:** translate attributes inside elements marked for translation ([424e6c4](https://github.com/angular/angular/commit/424e6c4)), closes [#13796](https://github.com/angular/angular/issues/13796) [#13814](https://github.com/angular/angular/issues/13814)
+* **router:** RouterLink mirrors input `target` as attribute ([d9a22da](https://github.com/angular/angular/commit/d9a22da)), closes [#13837](https://github.com/angular/angular/issues/13837)
+* **router:** throw an error when navigate to null/undefined path ([46cb04d](https://github.com/angular/angular/commit/46cb04d)), closes [#10560](https://github.com/angular/angular/issues/10560) [#13384](https://github.com/angular/angular/issues/13384)
+* **router:** fix checking for object intersection ([6d29fae](https://github.com/angular/angular/commit/6d29fae))
+
+
+### Features
+
+* **animations:** expose the `element` value within transition events ([4bae4b3](https://github.com/angular/angular/commit/4bae4b3))
+* **animations:** expose the `triggerName` within the transition event ([3f67ab0](https://github.com/angular/angular/commit/3f67ab0)), closes [#13600](https://github.com/angular/angular/issues/13600)
+* **animations:** support function types in transitions ([9211a22](https://github.com/angular/angular/commit/9211a22)), closes [#13538](https://github.com/angular/angular/issues/13538) [#13537](https://github.com/angular/angular/issues/13537)
+* **language-service:** support TS2.2 plugin model ([99aa49a](https://github.com/angular/angular/commit/99aa49a))
+* **NgComponentOutlet:** add NgComponentOutlet directive ([8578682](https://github.com/angular/angular/commit/8578682)), closes [#11168](https://github.com/angular/angular/issues/11168)
+* **NgTemplateOutlet:** Make NgTemplateOutlet compatible with * syntax ([c0178de](https://github.com/angular/angular/commit/c0178de))
+* **router:** call resolver when upstream params change ([#12942](https://github.com/angular/angular/issues/12942)) ([d4d3782](https://github.com/angular/angular/commit/d4d3782))
+
+
+### BREAKING CHANGES
+
+* core: - `IterableChangeRecord` is now an interface and parameterized on `<V>`.
+  This should not be an issue unless your code does
+  `new IterableChangeRecord` which it should not have a reason to do.
+- `KeyValueChangeRecord` is now an interface and parameterized on `<V>`.
+  This should not be an issue unless your code does
+  `new IterableChangeRecord` which it should not have a reason to do.
+
+### DEPRECATION
+
+* Deprecate `ngOutletContext`. Use `ngTemplateOutletContext` instead.
+* `CollectionChangeRecord` is renamed to `IterableChangeRecord`.
+  `CollectionChangeRecord` is aliased to `IterableChangeRecord` and is
+  marked as `@deprecated`. It will be removed in `v6.x.x`.
+* Deprecate `DefaultIterableDiffer` as it is private class which
+  was erroneously exposed.
+* Deprecate `KeyValueDiffers#factories` as it is private field which
+  was erroneously exposed.
+* Deprecate `IterableDiffers#factories` as it is private field which
+  was erroneously exposed.
+
+
+
+<a name="2.4.3"></a>
+## [2.4.3](https://github.com/angular/angular/compare/2.4.2...2.4.3) (2017-01-11)
+
+
+### Bug Fixes
+
+* **compiler:** avoid evaluating arguments to unknown decorators ([5e9d3db](https://github.com/angular/angular/commit/5e9d3db)), closes [#13605](https://github.com/angular/angular/issues/13605)
+* **compiler:** fix template binding parsing (`*directive="-..."`) ([7dc12b9](https://github.com/angular/angular/commit/7dc12b9)), closes [#13800](https://github.com/angular/angular/issues/13800)
+* **compiler-cli:** add support for more than 2 levels of nested lazy routes ([6164eb2](https://github.com/angular/angular/commit/6164eb2)), closes [angular/angular-cli#3663](https://github.com/angular/angular-cli/issues/3663)
+* **compiler-cli:** avoid handling functions in loadChildren as lazy load routes paths ([313683f](https://github.com/angular/angular/commit/313683f)), closes [angular/angular-cli#3204](https://github.com/angular/angular-cli/issues/3204)
+* **i18n:** translate attributes inside elements marked for translation ([d7f2a3c](https://github.com/angular/angular/commit/d7f2a3c))
+* **router:** RouterLink mirrors input `target` as attribute ([1c82b58](https://github.com/angular/angular/commit/1c82b58)), closes [#13837](https://github.com/angular/angular/issues/13837)
+* **router:** throw an error when navigate to null/undefined path ([61ba223](https://github.com/angular/angular/commit/61ba223)), closes [#10560](https://github.com/angular/angular/issues/10560) [#13384](https://github.com/angular/angular/issues/13384)
+* **router:** fix checking for object intersection ([1692265](https://github.com/angular/angular/commit/1692265))
+
+
+
+<a name="2.4.2"></a>
+## [2.4.2](https://github.com/angular/angular/compare/2.4.1...2.4.2) (2017-01-06)
+
+
+### Bug Fixes
+
+* **common:** add link to trackBy docs from the error message ([#13634](https://github.com/angular/angular/issues/13634)) ([f723437](https://github.com/angular/angular/commit/f723437))
+* **common:** do not override locale provided on bootstrap ([#13654](https://github.com/angular/angular/issues/13654)) ([5f49c3e](https://github.com/angular/angular/commit/5f49c3e)), closes [#13607](https://github.com/angular/angular/issues/13607)
+* **common:** allow null/undefined values for `NgForTrackBy` ([6be55cc](https://github.com/angular/angular/commit/6be55cc)), closes [#13641](https://github.com/angular/angular/issues/13641)
+* **compiler:** don’t throw when using `ANALYZE_FOR_ENTRY_COMPONENTS` with user classes ([#13679](https://github.com/angular/angular/issues/13679)) ([230e33f](https://github.com/angular/angular/commit/230e33f)), closes [#13565](https://github.com/angular/angular/issues/13565)
+* **compiler:** query `<template>` elements before their children. ([#13677](https://github.com/angular/angular/issues/13677)) ([1cd73c7](https://github.com/angular/angular/commit/1cd73c7)), closes [#13118](https://github.com/angular/angular/issues/13118) [#13167](https://github.com/angular/angular/issues/13167)
+* **compiler:** allow "." in attribute selectors ([#13653](https://github.com/angular/angular/issues/13653)) ([29ffdfd](https://github.com/angular/angular/commit/29ffdfd)), closes [#13645](https://github.com/angular/angular/issues/13645)
+* **core:** animations no longer silently exits if the element is not apart of the DOM ([#13763](https://github.com/angular/angular/issues/13763)) ([f1cde43](https://github.com/angular/angular/commit/f1cde43))
+* **core:** animations should blend in all previously transitioned styles into next animation if interrupted ([#13148](https://github.com/angular/angular/issues/13148)) ([b245b92](https://github.com/angular/angular/commit/b245b92))
+* **core:** remove reference to "Angular 2" in dev mode warning ([#13751](https://github.com/angular/angular/issues/13751)) ([21f5f05](https://github.com/angular/angular/commit/21f5f05))
+* **core/testing:** improve misleading error message when don't call compileComponents ([#13543](https://github.com/angular/angular/issues/13543)) ([0e7f9f0](https://github.com/angular/angular/commit/0e7f9f0)), closes [#11301](https://github.com/angular/angular/issues/11301)
+* **forms:** Validators.required properly validate arrays ([#13362](https://github.com/angular/angular/issues/13362)) ([17c5fa9](https://github.com/angular/angular/commit/17c5fa9)), closes [#12274](https://github.com/angular/angular/issues/12274)
+* **language-service:** support TypeScript 2.1 ([#13655](https://github.com/angular/angular/issues/13655)) ([56b4296](https://github.com/angular/angular/commit/56b4296))
+* **router:** fix lazy loaded module with wildcard route ([#13649](https://github.com/angular/angular/issues/13649)) ([5754ecc](https://github.com/angular/angular/commit/5754ecc)), closes [#12955](https://github.com/angular/angular/issues/12955)
+* **router:** routerLink support of null ([#13380](https://github.com/angular/angular/issues/13380)) ([018865e](https://github.com/angular/angular/commit/018865e)), closes [#6971](https://github.com/angular/angular/issues/6971)
+* **router:** update route snapshot before emit new values ([#13558](https://github.com/angular/angular/issues/13558)) ([9f6a647](https://github.com/angular/angular/commit/9f6a647)), closes [#12912](https://github.com/angular/angular/issues/12912)
+* **upgrade:** fix/improve support for lifecycle hooks ([#13020](https://github.com/angular/angular/issues/13020)) ([21942a8](https://github.com/angular/angular/commit/21942a8))
+
+
+
+<a name="4.0.0-beta.2"></a>
+# [4.0.0-beta.2](https://github.com/angular/angular/compare/4.0.0-beta.1...4.0.0-beta.2) (2017-01-06)
+
+
+### Features
+
+* **compiler:** generate less code for bindings to DOM elements ([db49d42](https://github.com/angular/angular/commit/db49d42))
+* **compiler:** generate proper reexports in `.ngfactory.ts` files to not need transitive deps for compiling `.ngfactory.ts` files. ([#13524](https://github.com/angular/angular/issues/13524)) ([9c69703](https://github.com/angular/angular/commit/9c69703)), closes [#12787](https://github.com/angular/angular/issues/12787)
+* **router:** add an extra argument to CanDeactivate interface ([#13560](https://github.com/angular/angular/issues/13560)) ([69fa3bb](https://github.com/angular/angular/commit/69fa3bb)), closes [#9853](https://github.com/angular/angular/issues/9853)
+
+
+### Bug Fixes
+
+* **compiler:** improve error message for undefined providers ([#13546](https://github.com/angular/angular/issues/13546)) ([6b02b80](https://github.com/angular/angular/commit/6b02b80)), closes [#10835](https://github.com/angular/angular/issues/10835)
+* **compiler:** improve the error when template is not a string ([2c0c86e](https://github.com/angular/angular/commit/2c0c86e)), closes [#8708](https://github.com/angular/angular/issues/8708) [#13377](https://github.com/angular/angular/issues/13377)
+* **compiler:** throw an error for invalid provider ([#13544](https://github.com/angular/angular/issues/13544)) ([445ed43](https://github.com/angular/angular/commit/445ed43)), closes [#8870](https://github.com/angular/angular/issues/8870)
+* **i18n:** parse ICU messages while normalizing templates ([e74d8aa](https://github.com/angular/angular/commit/e74d8aa))
+
+Note: 4.0.0-beta.2 release also contains all the changes present in the 2.4.2 release.
+
+
+### BREAKING CHANGES
+
+* **core**: `SimpleChange` now takes an additional argument that defines whether this is the first
+change or not. This is a low profile API and we don't expect anyone to be affected by this change.
+If you are impacted by this change please file an issue. ([465516b](https://github.com/angular/angular/commit/465516b))
+
+
+
+
 <a name="4.0.0-beta.1"></a>
 # [4.0.0-beta.1](https://github.com/angular/angular/compare/2.4.0-marker...4.0.0-beta.1) (2016-12-22)
 
@@ -104,10 +228,10 @@ Note: 4.0.0-beta.0 release also contains all the changes present in the 2.3.1 re
 
 ### Note ###
 
-Due to regression in the 2.3.0 release that was fixed by [#13464](https://github.com/angular/angular/pull/13464), 
+Due to regression in the 2.3.0 release that was fixed by [#13464](https://github.com/angular/angular/pull/13464),
 components that have been compiled using 2.3.0 and published to npm will need to be recompiled and republished.
 
-The >=2.3.1 compiler will issue is the following error if it encounters components compiled with 2.3.0:  
+The >=2.3.1 compiler will issue is the following error if it encounters components compiled with 2.3.0:
 `Unsupported metadata version 2 for module ${module}. This module should be compiled with a newer version of ngc`.
 
 We are adding more tests to our test suite to catch these kinds of problems before we cut a release.

DEVELOPER.md

@@ -133,7 +133,8 @@ If you happen to modify the public API of Angular, API golden files must be upda
 $ gulp public-api:update
 ```
 
-Note: The command `./test.sh tools` fails when the API doesn't match the golden files.
+Note: The command `gulp public-api:enforce` fails when the API doesn't match the golden files. Make sure to rebuild
+the project before trying to verify after an API change.
 
 ## <a name="clang-format"></a> Formatting your source code
 
@@ -146,6 +147,14 @@ You can automatically format your code by running:
 $ gulp format
 ```
 
+## Linting/verifying your source code
+
+You can check that your code is properly formatted and adheres to coding style by running:
+
+``` shell
+$ gulp lint
+```
+
 ## Publishing your own personal snapshot build
 
 You may find that your un-merged change needs some validation from external participants.

docs/RELEASE_SCHEDULE.md

@@ -0,0 +1,82 @@
+# Angular Release Schedule
+
+This document contains historic record of past Angular releases and future release schedule.
+
+The purpose of this document is to assist coordination among the Angular team, Angular contributors, Angular application teams, and Angular community projects.
+
+We'll keep this doc up to date when unplanned releases or other schedule changes occur.
+
+
+## Schedule Caveats and Exceptions
+
+The dates listed here are approximate – last minute issues, team or community events, etc. can cause us to release a few days sooner or later.
+
+This page contains only planned and past unplanned releases.
+Due to serious regressions or other important reasons we reserve the right to release an unplanned patch or minor release.
+In such case, we'll update this document accordingly.
+
+The dates past March 2017 are just a guidance and might be adjusted slightly if necessary.
+
+
+## Tentative Schedule Until March 2017
+
+<!--
+The table below is formatted so that it's easy to read and edit in both markdown and rendered html form.
+
+In order to deal with undesirable line breaks, two special characters are occasionally used:
+
+- non-breaking hyphen: "‑" http://www.fileformat.info/info/unicode/char/2011/index.htm
+- non-breaking space: " " http://www.fileformat.info/info/unicode/char/00a0/index.htm
+
+If you see undesirable wrapping issues in the rendered form, please copy&paste the quoted characters and use them in the table below where needed.
+-->
+
+Week Of       | Stable Release<br>(@latest npm tag) | Beta/RC Release<br>(@next npm tag) | Note
+------------- | ----------------------------------- | ---------------------------------- | ---------------------
+2016-09-14    | 2.0.0                               | -                                  | Major Version Release
+2016-09-21    | 2.0.1                               | 2.1.0-beta.0                       |
+2016‑09‑28    | -                                   | -                                  | Angular Connect
+2016-10-05    | 2.0.2                               | 2.1.0-rc.0                         |
+2016-10-12    | 2.1.0                               | -                                  | Minor Version Release
+2016-10-19    | 2.1.1                               | 2.2.0-beta.0                       |
+2016-10-26    | 2.1.2                               | 2.2.0-beta.1                       |
+2016-11-02    | 2.1.3                               | 2.2.0-rc.0                         |
+2016-11-09    | 2.2.0                               | -                                  | Minor Version Release
+2016-11-16    | 2.2.1                               | 2.3.0-beta.0                       |
+2016-11-23    | 2.2.2                               | 2.3.0-beta.1                       |
+*2016-11-23*  | *2.2.3*                             | -                                  | *Unplanned Patch Release to fix regressions*
+2016-11-30    | 2.2.4                               | 2.3.0-rc.0                         |
+2016-12-07    | 2.3.0                               | -                                  | Minor Version Release
+2016-12-14    | 2.3.1                               | 4.0.0-beta.0                       |
+*2016-12-21*  | *2.4.0*                             | -                                  | *Unplanned Minor Release due to release of RxJS 5.0.0*
+2016-12-21    | 2.4.1                               | 4.0.0-beta.1                       |
+2016-12-28    | -                                   | -                                  | Holiday Break
+2017-01-04    | 2.4.2                               | 4.0.0-beta.2                       |
+2017-01-11    | 2.4.3                               | 4.0.0-beta.3                       |
+2017-01-18    | 2.4.4                               | 4.0.0-beta.4                       |
+2017-01-25    | 2.4.5                               | 4.0.0-beta.5                       |
+2017-02-01    | 2.4.6                               | 4.0.0-beta.6                       |
+2017-02-08    | 2.4.7                               | 4.0.0-rc.0                         |
+2017-02-15    | 2.4.8                               | 4.0.0-rc.1                         |
+2017-02-22    | 2.4.9                               | 4.0.0-rc.2                         |
+2017-03-01    | 2.4.10                              | 4.0.0-rc.3                         |
+2017-03-08    | 4.0.0 + 2.4.11                      | -                                  | Major Version Release
+
+
+## Tentative Schedule After March 2017
+
+ Date                   | Stable Release | Compatibility`*`
+ ---------------------- | -------------- | ----------------
+ September/October 2017 | 5.0.0          | ^4.0.0
+ March 2018             | 6.0.0          | ^5.0.0
+ September/October 2018 | 7.0.0          | ^6.0.0
+
+ `*` The goal of the backwards compatibility promise, is to ensure that changes in the core framework and tooling don't break the existing ecosystem of components and applications and don't put undue upgrade/migration burden on Angular application and component authors.
+
+
+## More Info & Resources
+
+In [September 2016 we announced](http://angularjs.blogspot.com/2016/10/versioning-and-releasing-angular.html) that Angular is fully adopting [semantic versioning](http://semver.org/) and that we'll be releasing patch versions on a weekly basis (~50 per year), minor versions monthly for 3 months following a major version release, and every 6 months we'll release a major version that will be backwards compatible with the previous release for most developers, but might remove APIs that have been deprecated two major versions ago (6 or more months ago).
+
+In [December 2016 we clarified this message](http://angularjs.blogspot.com/2016/12/ok-let-me-explain-its-going-to-be.html), and provided additional details about the plans to release Angular 4.0.0 in March 2017.
+This document contains updates to the schedule that happened since then.

modules/@angular/common/src/common.ts

@@ -14,7 +14,6 @@
 export * from './location/index';
 export {NgLocaleLocalization, NgLocalization} from './localization';
 export {CommonModule} from './common_module';
-export {NgClass, NgFor, NgIf, NgPlural, NgPluralCase, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgTemplateOutlet} from './directives/index';
+export {NgClass, NgFor, NgIf, NgPlural, NgPluralCase, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgTemplateOutlet, NgComponentOutlet} from './directives/index';
 export {AsyncPipe, DatePipe, I18nPluralPipe, I18nSelectPipe, JsonPipe, LowerCasePipe, CurrencyPipe, DecimalPipe, PercentPipe, SlicePipe, UpperCasePipe, TitleCasePipe} from './pipes/index';
 export {VERSION} from './version';
-export {Version} from '@angular/core';

modules/@angular/common/src/directives/index.ts

@@ -9,6 +9,7 @@
 import {Provider} from '@angular/core';
 
 import {NgClass} from './ng_class';
+import {NgComponentOutlet} from './ng_component_outlet';
 import {NgFor} from './ng_for';
 import {NgIf} from './ng_if';
 import {NgPlural, NgPluralCase} from './ng_plural';
@@ -18,6 +19,7 @@ import {NgTemplateOutlet} from './ng_template_outlet';
 
 export {
   NgClass,
+  NgComponentOutlet,
   NgFor,
   NgIf,
   NgPlural,
@@ -29,12 +31,14 @@ export {
   NgTemplateOutlet
 };
 
+
 /**
  * A collection of Angular directives that are likely to be used in each and every Angular
  * application.
  */
 export const COMMON_DIRECTIVES: Provider[] = [
   NgClass,
+  NgComponentOutlet,
   NgFor,
   NgIf,
   NgTemplateOutlet,

modules/@angular/common/src/directives/ng_class.ts

@@ -6,10 +6,10 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CollectionChangeRecord, Directive, DoCheck, ElementRef, Input, IterableDiffer, IterableDiffers, KeyValueChangeRecord, KeyValueDiffer, KeyValueDiffers, Renderer} from '@angular/core';
+import {Directive, DoCheck, ElementRef, Input, IterableChanges, IterableDiffer, IterableDiffers, KeyValueChanges, KeyValueDiffer, KeyValueDiffers, Renderer} from '@angular/core';
 
 import {isListLikeIterable} from '../facade/collection';
-import {isPresent, stringify} from '../facade/lang';
+import {stringify} from '../facade/lang';
 
 /**
  * @ngModule CommonModule
@@ -25,6 +25,8 @@ import {isPresent, stringify} from '../facade/lang';
  *     <some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>
  *
  *     <some-element [ngClass]="stringExp|arrayExp|objExp">...</some-element>
+ *
+ *     <some-element [ngClass]="{'class1 class2 class3' : true}">...</some-element>
  * ```
  *
  * @description
@@ -39,8 +41,8 @@ import {isPresent, stringify} from '../facade/lang';
  */
 @Directive({selector: '[ngClass]'})
 export class NgClass implements DoCheck {
-  private _iterableDiffer: IterableDiffer;
-  private _keyValueDiffer: KeyValueDiffer;
+  private _iterableDiffer: IterableDiffer<string>;
+  private _keyValueDiffer: KeyValueDiffer<string, any>;
   private _initialClasses: string[] = [];
   private _rawClass: string[]|Set<string>|{[klass: string]: any};
 
@@ -76,39 +78,35 @@ export class NgClass implements DoCheck {
 
   ngDoCheck(): void {
     if (this._iterableDiffer) {
-      const changes = this._iterableDiffer.diff(this._rawClass);
-      if (changes) {
-        this._applyIterableChanges(changes);
+      const iterableChanges = this._iterableDiffer.diff(this._rawClass as string[]);
+      if (iterableChanges) {
+        this._applyIterableChanges(iterableChanges);
       }
     } else if (this._keyValueDiffer) {
-      const changes = this._keyValueDiffer.diff(this._rawClass);
-      if (changes) {
-        this._applyKeyValueChanges(changes);
+      const keyValueChanges = this._keyValueDiffer.diff(this._rawClass as{[k: string]: any});
+      if (keyValueChanges) {
+        this._applyKeyValueChanges(keyValueChanges);
       }
     }
   }
 
-  private _cleanupClasses(rawClassVal: string[]|Set<string>|{[klass: string]: any}): void {
+  private _cleanupClasses(rawClassVal: string[]|{[klass: string]: any}): void {
     this._applyClasses(rawClassVal, true);
     this._applyInitialClasses(false);
   }
 
-  private _applyKeyValueChanges(changes: any): void {
-    changes.forEachAddedItem(
-        (record: KeyValueChangeRecord) => this._toggleClass(record.key, record.currentValue));
-
-    changes.forEachChangedItem(
-        (record: KeyValueChangeRecord) => this._toggleClass(record.key, record.currentValue));
-
-    changes.forEachRemovedItem((record: KeyValueChangeRecord) => {
+  private _applyKeyValueChanges(changes: KeyValueChanges<string, any>): void {
+    changes.forEachAddedItem((record) => this._toggleClass(record.key, record.currentValue));
+    changes.forEachChangedItem((record) => this._toggleClass(record.key, record.currentValue));
+    changes.forEachRemovedItem((record) => {
       if (record.previousValue) {
         this._toggleClass(record.key, false);
       }
     });
   }
 
-  private _applyIterableChanges(changes: any): void {
-    changes.forEachAddedItem((record: CollectionChangeRecord) => {
+  private _applyIterableChanges(changes: IterableChanges<string>): void {
+    changes.forEachAddedItem((record) => {
       if (typeof record.item === 'string') {
         this._toggleClass(record.item, true);
       } else {
@@ -117,8 +115,7 @@ export class NgClass implements DoCheck {
       }
     });
 
-    changes.forEachRemovedItem(
-        (record: CollectionChangeRecord) => this._toggleClass(record.item, false));
+    changes.forEachRemovedItem((record) => this._toggleClass(record.item, false));
   }
 
   private _applyInitialClasses(isCleanup: boolean) {
@@ -126,23 +123,23 @@ export class NgClass implements DoCheck {
   }
 
   private _applyClasses(
-      rawClassVal: string[]|Set<string>|{[key: string]: any}, isCleanup: boolean) {
+      rawClassVal: string[]|Set<string>|{[klass: string]: any}, isCleanup: boolean) {
     if (rawClassVal) {
       if (Array.isArray(rawClassVal) || rawClassVal instanceof Set) {
         (<any>rawClassVal).forEach((klass: string) => this._toggleClass(klass, !isCleanup));
       } else {
         Object.keys(rawClassVal).forEach(klass => {
-          if (isPresent(rawClassVal[klass])) this._toggleClass(klass, !isCleanup);
+          if (rawClassVal[klass] != null) this._toggleClass(klass, !isCleanup);
         });
       }
     }
   }
 
-  private _toggleClass(klass: string, enabled: boolean): void {
+  private _toggleClass(klass: string, enabled: any): void {
     klass = klass.trim();
     if (klass) {
       klass.split(/\s+/g).forEach(
-          klass => { this._renderer.setElementClass(this._ngEl.nativeElement, klass, enabled); });
+          klass => { this._renderer.setElementClass(this._ngEl.nativeElement, klass, !!enabled); });
     }
   }
 }

modules/@angular/common/src/directives/ng_component_outlet.ts

@@ -0,0 +1,86 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import {ComponentFactoryResolver, ComponentRef, Directive, Injector, Input, OnChanges, Provider, SimpleChanges, Type, ViewContainerRef} from '@angular/core';
+
+
+/**
+ * Instantiates a single {@link Component} type and inserts its Host View into current View.
+ * `NgComponentOutlet` provides a declarative approach for dynamic component creation.
+ *
+ * `NgComponentOutlet` requires a component type, if a falsy value is set the view will clear and
+ * any existing component will get destroyed.
+ *
+ * ### Fine tune control
+ *
+ * You can control the component creation process by using the following optional attributes:
+ *
+ * * `ngOutletInjector`: Optional custom {@link Injector} that will be used as parent for the
+ * Component.
+ * Defaults to the injector of the current view container.
+ *
+ * * `ngOutletProviders`: Optional injectable objects ({@link Provider}) that are visible to the
+ * component.
+ *
+ * * `ngOutletContent`: Optional list of projectable nodes to insert into the content
+ * section of the component, if exists. ({@link NgContent}).
+ *
+ *
+ * ### Syntax
+ *
+ * Simple
+ * ```
+ * <ng-container *ngComponentOutlet="componentTypeExpression"></ng-container>
+ * ```
+ *
+ * Customized
+ * ```
+ * <ng-container *ngComponentOutlet="componentTypeExpression;
+ *                                   injector: injectorExpression;
+ *                                   content: contentNodesExpression">
+ * </ng-container>
+ * ```
+ *
+ * # Example
+ *
+ * {@example common/ngComponentOutlet/ts/module.ts region='SimpleExample'}
+ *
+ * A more complete example with additional options:
+ *
+ * {@example common/ngComponentOutlet/ts/module.ts region='CompleteExample'}
+ *
+ * @experimental
+ */
+@Directive({selector: '[ngComponentOutlet]'})
+export class NgComponentOutlet implements OnChanges {
+  @Input() ngComponentOutlet: Type<any>;
+  @Input() ngComponentOutletInjector: Injector;
+  @Input() ngComponentOutletContent: any[][];
+
+  componentRef: ComponentRef<any>;
+
+  constructor(
+      private _cmpFactoryResolver: ComponentFactoryResolver,
+      private _viewContainerRef: ViewContainerRef) {}
+
+  ngOnChanges(changes: SimpleChanges) {
+    if (this.componentRef) {
+      this._viewContainerRef.remove(this._viewContainerRef.indexOf(this.componentRef.hostView));
+    }
+    this._viewContainerRef.clear();
+    this.componentRef = null;
+
+    if (this.ngComponentOutlet) {
+      let injector = this.ngComponentOutletInjector || this._viewContainerRef.parentInjector;
+
+      this.componentRef = this._viewContainerRef.createComponent(
+          this._cmpFactoryResolver.resolveComponentFactory(this.ngComponentOutlet),
+          this._viewContainerRef.length, injector, this.ngComponentOutletContent);
+    }
+  }
+}

modules/@angular/common/src/directives/ng_for.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {ChangeDetectorRef, CollectionChangeRecord, DefaultIterableDiffer, Directive, DoCheck, EmbeddedViewRef, Input, IterableDiffer, IterableDiffers, OnChanges, SimpleChanges, TemplateRef, TrackByFn, ViewContainerRef} from '@angular/core';
+import {ChangeDetectorRef, Directive, DoCheck, EmbeddedViewRef, Input, IterableChangeRecord, IterableChanges, IterableDiffer, IterableDiffers, OnChanges, SimpleChanges, TemplateRef, TrackByFn, ViewContainerRef, isDevMode} from '@angular/core';
 
 import {getTypeNameForDebugging} from '../facade/lang';
 
@@ -91,15 +91,20 @@ export class NgFor implements DoCheck, OnChanges {
   @Input() ngForOf: any;
   @Input()
   set ngForTrackBy(fn: TrackByFn) {
-    if (typeof fn !== 'function') {
-      throw new Error(`trackBy must be a function, but received ${JSON.stringify(fn)}`);
+    if (isDevMode() && fn != null && typeof fn !== 'function') {
+      // TODO(vicb): use a log service once there is a public one available
+      if (<any>console && <any>console.warn) {
+        console.warn(
+            `trackBy must be a function, but received ${JSON.stringify(fn)}. ` +
+            `See https://angular.io/docs/ts/latest/api/common/index/NgFor-directive.html#!#change-propagation for more information.`);
+      }
     }
     this._trackByFn = fn;
   }
 
   get ngForTrackBy(): TrackByFn { return this._trackByFn; }
 
-  private _differ: IterableDiffer = null;
+  private _differ: IterableDiffer<any> = null;
   private _trackByFn: TrackByFn;
 
   constructor(
@@ -135,10 +140,10 @@ export class NgFor implements DoCheck, OnChanges {
     }
   }
 
-  private _applyChanges(changes: DefaultIterableDiffer) {
+  private _applyChanges(changes: IterableChanges<any>) {
     const insertTuples: RecordViewTuple[] = [];
     changes.forEachOperation(
-        (item: CollectionChangeRecord, adjustedPreviousIndex: number, currentIndex: number) => {
+        (item: IterableChangeRecord<any>, adjustedPreviousIndex: number, currentIndex: number) => {
           if (item.previousIndex == null) {
             const view = this._viewContainer.createEmbeddedView(
                 this._template, new NgForRow(null, null, null), currentIndex);
@@ -170,7 +175,7 @@ export class NgFor implements DoCheck, OnChanges {
     });
   }
 
-  private _perViewChange(view: EmbeddedViewRef<NgForRow>, record: CollectionChangeRecord) {
+  private _perViewChange(view: EmbeddedViewRef<NgForRow>, record: IterableChangeRecord<any>) {
     view.context.$implicit = record.item;
   }
 }

modules/@angular/common/src/directives/ng_if.ts

@@ -13,14 +13,14 @@ import {Directive, EmbeddedViewRef, Input, TemplateRef, ViewContainerRef} from '
  * Conditionally includes a template based on the value of an `expression`.
  *
  * `ngIf` evaluates the `expression` and then renders the `then` or `else` template in its place
- * when expression is thruthy or falsy respectively. Typically the:
+ * when expression is truthy or falsy respectively. Typically the:
  *  - `then` template is the inline template of `ngIf` unless bound to a different value.
- *  - `else` template is blank unless its bound.
+ *  - `else` template is blank unless it is bound.
  *
  * # Most common usage
  *
- * The most common usage of the `ngIf` is to conditionally show the inline template as seen in this
- * example:
+ * The most common usage of the `ngIf` directive is to conditionally show the inline template as
+ * seen in this example:
  * {@example common/ngIf/ts/module.ts region='NgIfSimple'}
  *
  * # Showing an alternative template using `else`
@@ -36,13 +36,13 @@ import {Directive, EmbeddedViewRef, Input, TemplateRef, ViewContainerRef} from '
  *
  * Usually the `then` template is the inlined template of the `ngIf`, but it can be changed using
  * a binding (just like `else`). Because `then` and `else` are bindings, the template references can
- * change at runtime as shown in thise example.
+ * change at runtime as shown in this example.
  *
  * {@example common/ngIf/ts/module.ts region='NgIfThenElse'}
  *
  * # Storing conditional result in a variable
  *
- * A common patter is that we need to show a set of properties from the same object. if the
+ * A common pattern is that we need to show a set of properties from the same object. If the
  * object is undefined, then we have to use the safe-traversal-operator `?.` to guard against
  * dereferencing a `null` value. This is especially the case when waiting on async data such as
  * when using the `async` pipe as shown in folowing example:
@@ -51,10 +51,10 @@ import {Directive, EmbeddedViewRef, Input, TemplateRef, ViewContainerRef} from '
  * Hello {{ (userStream|async)?.last }}, {{ (userStream|async)?.first }}!
  * ```
  *
- * There are several inefficiencies in the above example.
- *  - We create multiple subscriptions on the `userStream`. One for each `async` pipe, or two
- *    as shown in the example above.
- *  - We can not display an alternative screen while waiting for the data to arrive asynchronously.
+ * There are several inefficiencies in the above example:
+ *  - We create multiple subscriptions on `userStream`. One for each `async` pipe, or two in the
+ *    example above.
+ *  - We cannot display an alternative screen while waiting for the data to arrive asynchronously.
  *  - We have to use the safe-traversal-operator `?.` to access properties, which is cumbersome.
  *  - We have to place the `async` pipe in parenthesis.
  *
@@ -66,7 +66,7 @@ import {Directive, EmbeddedViewRef, Input, TemplateRef, ViewContainerRef} from '
  * Notice that:
  *  - We use only one `async` pipe and hence only one subscription gets created.
  *  - `ngIf` stores the result of the `userStream|async` in the local variable `user`.
- *  - The local `user` can than be bound repeatedly in a more efficient way.
+ *  - The local `user` can then be bound repeatedly in a more efficient way.
  *  - No need to use the safe-traversal-operator `?.` to access properties as `ngIf` will only
  *    display the data if `userStream` returns a value.
  *  - We can display an alternative template while waiting for the data.

modules/@angular/common/src/directives/ng_plural.ts

@@ -21,10 +21,9 @@ import {SwitchView} from './ng_switch';
  * @howToUse
  * ```
  * <some-element [ngPlural]="value">
- *   <ng-container *ngPluralCase="'=0'">there is nothing</ng-container>
- *   <ng-container *ngPluralCase="'=1'">there is one</ng-container>
- *   <ng-container *ngPluralCase="'few'">there are a few</ng-container>
- *   <ng-container *ngPluralCase="'other'">there are exactly #</ng-container>
+ *   <template ngPluralCase="=0">there is nothing</template>
+ *   <template ngPluralCase="=1">there is one</template>
+ *   <template ngPluralCase="few">there are a few</template>
  * </some-element>
  * ```
  *
@@ -90,8 +89,8 @@ export class NgPlural {
  * @howToUse
  * ```
  * <some-element [ngPlural]="value">
- *   <ng-container *ngPluralCase="'=0'">...</ng-container>
- *   <ng-container *ngPluralCase="'other'">...</ng-container>
+ *   <template ngPluralCase="=0">...</template>
+ *   <template ngPluralCase="other">...</template>
  * </some-element>
  *```
  *

modules/@angular/common/src/directives/ng_style.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Directive, DoCheck, ElementRef, Input, KeyValueChangeRecord, KeyValueDiffer, KeyValueDiffers, Renderer} from '@angular/core';
+import {Directive, DoCheck, ElementRef, Input, KeyValueChanges, KeyValueDiffer, KeyValueDiffers, Renderer} from '@angular/core';
 
 /**
  * @ngModule CommonModule
@@ -33,7 +33,7 @@ import {Directive, DoCheck, ElementRef, Input, KeyValueChangeRecord, KeyValueDif
 @Directive({selector: '[ngStyle]'})
 export class NgStyle implements DoCheck {
   private _ngStyle: {[key: string]: string};
-  private _differ: KeyValueDiffer;
+  private _differ: KeyValueDiffer<string, string|number>;
 
   constructor(
       private _differs: KeyValueDiffers, private _ngEl: ElementRef, private _renderer: Renderer) {}
@@ -55,20 +55,16 @@ export class NgStyle implements DoCheck {
     }
   }
 
-  private _applyChanges(changes: any): void {
-    changes.forEachRemovedItem((record: KeyValueChangeRecord) => this._setStyle(record.key, null));
-
-    changes.forEachAddedItem(
-        (record: KeyValueChangeRecord) => this._setStyle(record.key, record.currentValue));
-
-    changes.forEachChangedItem(
-        (record: KeyValueChangeRecord) => this._setStyle(record.key, record.currentValue));
+  private _applyChanges(changes: KeyValueChanges<string, string|number>): void {
+    changes.forEachRemovedItem((record) => this._setStyle(record.key, null));
+    changes.forEachAddedItem((record) => this._setStyle(record.key, record.currentValue));
+    changes.forEachChangedItem((record) => this._setStyle(record.key, record.currentValue));
   }
 
-  private _setStyle(nameAndUnit: string, value: string): void {
+  private _setStyle(nameAndUnit: string, value: string|number): void {
     const [name, unit] = nameAndUnit.split('.');
-    value = value && unit ? `${value}${unit}` : value;
+    value = value != null && unit ? `${value}${unit}` : value;
 
-    this._renderer.setElementStyle(this._ngEl.nativeElement, name, value);
+    this._renderer.setElementStyle(this._ngEl.nativeElement, name, value as string);
   }
 }

modules/@angular/common/src/directives/ng_template_outlet.ts

@@ -15,42 +15,47 @@ import {Directive, EmbeddedViewRef, Input, OnChanges, SimpleChanges, TemplateRef
  *
  * @howToUse
  * ```
- * <template [ngTemplateOutlet]="templateRefExpression"
- *           [ngOutletContext]="objectExpression">
- * </template>
+ * <ng-container *ngTemplateOutlet="templateRefExp; context: contextExp"></ng-container>
  * ```
  *
  * @description
  *
- * You can attach a context object to the `EmbeddedViewRef` by setting `[ngOutletContext]`.
- * `[ngOutletContext]` should be an object, the object's keys will be the local template variables
- * available within the `TemplateRef`.
+ * You can attach a context object to the `EmbeddedViewRef` by setting `[ngTemplateOutletContext]`.
+ * `[ngTemplateOutletContext]` should be an object, the object's keys will be available for binding
+ * by the local template `let` declarations.
  *
  * Note: using the key `$implicit` in the context object will set it's value as default.
  *
+ * # Example
+ *
+ * {@example common/ngTemplateOutlet/ts/module.ts region='NgTemplateOutlet'}
+ *
  * @experimental
  */
 @Directive({selector: '[ngTemplateOutlet]'})
 export class NgTemplateOutlet implements OnChanges {
   private _viewRef: EmbeddedViewRef<any>;
-  private _context: Object;
-  private _templateRef: TemplateRef<any>;
+
+  @Input() public ngTemplateOutletContext: Object;
+
+  @Input() public ngTemplateOutlet: TemplateRef<any>;
 
   constructor(private _viewContainerRef: ViewContainerRef) {}
 
+  /**
+   * @deprecated v4.0.0 - Renamed to ngTemplateOutletContext.
+   */
   @Input()
-  set ngOutletContext(context: Object) { this._context = context; }
-
-  @Input()
-  set ngTemplateOutlet(templateRef: TemplateRef<Object>) { this._templateRef = templateRef; }
+  set ngOutletContext(context: Object) { this.ngTemplateOutletContext = context; }
 
   ngOnChanges(changes: SimpleChanges) {
     if (this._viewRef) {
       this._viewContainerRef.remove(this._viewContainerRef.indexOf(this._viewRef));
     }
 
-    if (this._templateRef) {
-      this._viewRef = this._viewContainerRef.createEmbeddedView(this._templateRef, this._context);
+    if (this.ngTemplateOutlet) {
+      this._viewRef = this._viewContainerRef.createEmbeddedView(
+          this.ngTemplateOutlet, this.ngTemplateOutletContext);
     }
   }
 }

modules/@angular/common/src/pipes/case_conversion_pipes.ts

@@ -12,7 +12,7 @@ import {InvalidPipeArgumentError} from './invalid_pipe_argument_error';
 /**
  * Transforms text to lowercase.
  *
- * {@example  core/pipes/ts/lowerupper_pipe/lowerupper_pipe_example.ts region='LowerUpperPipe' }
+ * {@example  common/pipes/ts/lowerupper_pipe.ts region='LowerUpperPipe' }
  *
  * @stable
  */

modules/@angular/common/src/pipes/i18n_plural_pipe.ts

@@ -7,7 +7,6 @@
  */
 
 import {Pipe, PipeTransform} from '@angular/core';
-import {isBlank} from '../facade/lang';
 import {NgLocalization, getPluralCategory} from '../localization';
 import {InvalidPipeArgumentError} from './invalid_pipe_argument_error';
 
@@ -35,7 +34,7 @@ export class I18nPluralPipe implements PipeTransform {
   constructor(private _localization: NgLocalization) {}
 
   transform(value: number, pluralMap: {[count: string]: string}): string {
-    if (isBlank(value)) return '';
+    if (value == null) return '';
 
     if (typeof pluralMap !== 'object' || pluralMap === null) {
       throw new InvalidPipeArgumentError(I18nPluralPipe, pluralMap);

modules/@angular/common/src/pipes/number_pipe.ts

@@ -8,7 +8,7 @@
 
 import {Inject, LOCALE_ID, Pipe, PipeTransform, Type} from '@angular/core';
 
-import {NumberWrapper, isBlank, isPresent} from '../facade/lang';
+import {NumberWrapper} from '../facade/lang';
 
 import {NumberFormatStyle, NumberFormatter} from './intl';
 import {InvalidPipeArgumentError} from './invalid_pipe_argument_error';
@@ -18,7 +18,7 @@ const _NUMBER_FORMAT_REGEXP = /^(\d+)?\.((\d+)(-(\d+))?)?$/;
 function formatNumber(
     pipe: Type<any>, locale: string, value: number | string, style: NumberFormatStyle,
     digits: string, currency: string = null, currencyAsSymbol: boolean = false): string {
-  if (isBlank(value)) return null;
+  if (value == null) return null;
 
   // Convert strings to numbers
   value = typeof value === 'string' && NumberWrapper.isNumeric(value) ? +value : value;
@@ -41,13 +41,13 @@ function formatNumber(
     if (parts === null) {
       throw new Error(`${digits} is not a valid digit info for number pipes`);
     }
-    if (isPresent(parts[1])) {  // min integer digits
+    if (parts[1] != null) {  // min integer digits
       minInt = NumberWrapper.parseIntAutoRadix(parts[1]);
     }
-    if (isPresent(parts[3])) {  // min fraction digits
+    if (parts[3] != null) {  // min fraction digits
       minFraction = NumberWrapper.parseIntAutoRadix(parts[3]);
     }
-    if (isPresent(parts[5])) {  // max fraction digits
+    if (parts[5] != null) {  // max fraction digits
       maxFraction = NumberWrapper.parseIntAutoRadix(parts[5]);
     }
   }

modules/@angular/common/src/pipes/slice_pipe.ts

@@ -7,7 +7,6 @@
  */
 
 import {Pipe, PipeTransform} from '@angular/core';
-import {isBlank} from '../facade/lang';
 import {InvalidPipeArgumentError} from './invalid_pipe_argument_error';
 
 /**
@@ -58,7 +57,7 @@ import {InvalidPipeArgumentError} from './invalid_pipe_argument_error';
 @Pipe({name: 'slice', pure: false})
 export class SlicePipe implements PipeTransform {
   transform(value: any, start: number, end?: number): any {
-    if (isBlank(value)) return value;
+    if (value == null) return value;
 
     if (!this.supports(value)) {
       throw new InvalidPipeArgumentError(SlicePipe, value);

modules/@angular/common/test/directives/ng_component_outlet_spec.ts

@@ -0,0 +1,184 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import {CommonModule} from '@angular/common';
+import {NgComponentOutlet} from '@angular/common/src/directives/ng_component_outlet';
+import {Component, ComponentRef, Inject, Injector, NO_ERRORS_SCHEMA, NgModule, OpaqueToken, Optional, Provider, QueryList, ReflectiveInjector, TemplateRef, Type, ViewChild, ViewChildren, ViewContainerRef} from '@angular/core';
+import {TestBed, async} from '@angular/core/testing';
+import {expect} from '@angular/platform-browser/testing/matchers';
+
+export function main() {
+  describe('insert/remove', () => {
+
+    beforeEach(() => { TestBed.configureTestingModule({imports: [TestModule]}); });
+
+    it('should do nothing if component is null', async(() => {
+         const template = `<template *ngComponentOutlet="currentComponent"></template>`;
+         TestBed.overrideComponent(TestComponent, {set: {template: template}});
+         let fixture = TestBed.createComponent(TestComponent);
+
+         fixture.componentInstance.currentComponent = null;
+         fixture.detectChanges();
+
+         expect(fixture.nativeElement).toHaveText('');
+       }));
+
+    it('should insert content specified by a component', async(() => {
+         let fixture = TestBed.createComponent(TestComponent);
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('');
+
+         fixture.componentInstance.currentComponent = InjectedComponent;
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('foo');
+       }));
+
+    it('should emit a ComponentRef once a component was created', async(() => {
+         let fixture = TestBed.createComponent(TestComponent);
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('');
+
+         fixture.componentInstance.cmpRef = null;
+         fixture.componentInstance.currentComponent = InjectedComponent;
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('foo');
+         expect(fixture.componentInstance.cmpRef).toBeAnInstanceOf(ComponentRef);
+         expect(fixture.componentInstance.cmpRef.instance).toBeAnInstanceOf(InjectedComponent);
+       }));
+
+
+    it('should clear view if component becomes null', async(() => {
+         let fixture = TestBed.createComponent(TestComponent);
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('');
+
+         fixture.componentInstance.currentComponent = InjectedComponent;
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('foo');
+
+         fixture.componentInstance.currentComponent = null;
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('');
+       }));
+
+
+    it('should swap content if component changes', async(() => {
+         let fixture = TestBed.createComponent(TestComponent);
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('');
+
+         fixture.componentInstance.currentComponent = InjectedComponent;
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('foo');
+
+         fixture.componentInstance.currentComponent = InjectedComponentAgain;
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('bar');
+       }));
+
+    it('should use the injector, if one supplied', async(() => {
+         let fixture = TestBed.createComponent(TestComponent);
+
+         const uniqueValue = {};
+         fixture.componentInstance.currentComponent = InjectedComponent;
+         fixture.componentInstance.injector = ReflectiveInjector.resolveAndCreate(
+             [{provide: TEST_TOKEN, useValue: uniqueValue}], fixture.componentRef.injector);
+
+         fixture.detectChanges();
+         let cmpRef: ComponentRef<InjectedComponent> = fixture.componentInstance.cmpRef;
+         expect(cmpRef).toBeAnInstanceOf(ComponentRef);
+         expect(cmpRef.instance).toBeAnInstanceOf(InjectedComponent);
+         expect(cmpRef.instance.testToken).toBe(uniqueValue);
+
+       }));
+
+    it('should resolve a with injector', async(() => {
+         let fixture = TestBed.createComponent(TestComponent);
+
+         fixture.componentInstance.cmpRef = null;
+         fixture.componentInstance.currentComponent = InjectedComponent;
+         fixture.detectChanges();
+         let cmpRef: ComponentRef<InjectedComponent> = fixture.componentInstance.cmpRef;
+         expect(cmpRef).toBeAnInstanceOf(ComponentRef);
+         expect(cmpRef.instance).toBeAnInstanceOf(InjectedComponent);
+         expect(cmpRef.instance.testToken).toBeNull();
+       }));
+
+    it('should render projectable nodes, if supplied', async(() => {
+         const template = `<template>projected foo</template>${TEST_CMP_TEMPLATE}`;
+         TestBed.overrideComponent(TestComponent, {set: {template: template}})
+             .configureTestingModule({schemas: [NO_ERRORS_SCHEMA]});
+
+         TestBed
+             .overrideComponent(InjectedComponent, {set: {template: `<ng-content></ng-content>`}})
+             .configureTestingModule({schemas: [NO_ERRORS_SCHEMA]});
+
+         let fixture = TestBed.createComponent(TestComponent);
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('');
+
+         fixture.componentInstance.currentComponent = InjectedComponent;
+         fixture.componentInstance.projectables =
+             [fixture.componentInstance.vcRef
+                  .createEmbeddedView(fixture.componentInstance.tplRefs.first)
+                  .rootNodes];
+
+
+         fixture.detectChanges();
+         expect(fixture.nativeElement).toHaveText('projected foo');
+       }));
+  });
+}
+
+const TEST_TOKEN = new OpaqueToken('TestToken');
+@Component({selector: 'injected-component', template: 'foo'})
+class InjectedComponent {
+  constructor(@Optional() @Inject(TEST_TOKEN) public testToken: any) {}
+}
+
+
+@Component({selector: 'injected-component-again', template: 'bar'})
+class InjectedComponentAgain {
+}
+
+const TEST_CMP_TEMPLATE =
+    `<template *ngComponentOutlet="currentComponent; injector: injector; content: projectables"></template>`;
+@Component({selector: 'test-cmp', template: TEST_CMP_TEMPLATE})
+class TestComponent {
+  currentComponent: Type<any>;
+  injector: Injector;
+  projectables: any[][];
+
+  get cmpRef(): ComponentRef<any> { return this.ngComponentOutlet.componentRef; }
+  set cmpRef(value: ComponentRef<any>) { this.ngComponentOutlet.componentRef = value; }
+
+  @ViewChildren(TemplateRef) tplRefs: QueryList<TemplateRef<any>>;
+  @ViewChild(NgComponentOutlet) ngComponentOutlet: NgComponentOutlet;
+
+  constructor(public vcRef: ViewContainerRef) {}
+}
+
+@NgModule({
+  imports: [CommonModule],
+  declarations: [TestComponent, InjectedComponent, InjectedComponentAgain],
+  exports: [TestComponent, InjectedComponent, InjectedComponentAgain],
+  entryComponents: [InjectedComponent, InjectedComponentAgain]
+})
+export class TestModule {
+}

modules/@angular/common/test/directives/ng_for_spec.ts

@@ -7,7 +7,7 @@
  */
 
 import {CommonModule} from '@angular/common';
-import {Component, ContentChild, TemplateRef} from '@angular/core';
+import {Component} from '@angular/core';
 import {ComponentFixture, TestBed, async} from '@angular/core/testing';
 import {By} from '@angular/platform-browser/src/dom/debug/by';
 import {expect} from '@angular/platform-browser/testing/matchers';
@@ -29,10 +29,7 @@ export function main() {
 
     beforeEach(() => {
       TestBed.configureTestingModule({
-        declarations: [
-          TestComponent,
-          ComponentUsingTestComponent,
-        ],
+        declarations: [TestComponent],
         imports: [CommonModule],
       });
     });
@@ -77,7 +74,7 @@ export function main() {
        }));
 
     it('should iterate over an array of objects', async(() => {
-         const template = '<ul><li template="ngFor let item of items">{{item["name"]}};</li></ul>';
+         const template = '<ul><li *ngFor="let item of items">{{item["name"]}};</li></ul>';
          fixture = createTestComponent(template);
 
          // INIT
@@ -95,7 +92,7 @@ export function main() {
        }));
 
     it('should gracefully handle nulls', async(() => {
-         const template = '<ul><li template="ngFor let item of null">{{item}};</li></ul>';
+         const template = '<ul><li *ngFor="let item of null">{{item}};</li></ul>';
          fixture = createTestComponent(template);
 
          detectChangesAndExpectText('');
@@ -140,12 +137,8 @@ export function main() {
        }));
 
     it('should repeat over nested arrays', async(() => {
-         const template = '<div>' +
-             '<div template="ngFor let item of items">' +
-             '<div template="ngFor let subitem of item">' +
-             '{{subitem}}-{{item.length}};' +
-             '</div>|' +
-             '</div>' +
+         const template = '<div *ngFor="let item of items">' +
+             '<div *ngFor="let subitem of item">{{subitem}}-{{item.length}};</div>|' +
              '</div>';
          fixture = createTestComponent(template);
 
@@ -157,10 +150,9 @@ export function main() {
        }));
 
     it('should repeat over nested arrays with no intermediate element', async(() => {
-         const template = '<div><template ngFor let-item [ngForOf]="items">' +
-             '<div template="ngFor let subitem of item">' +
-             '{{subitem}}-{{item.length}};' +
-             '</div></template></div>';
+         const template = '<div *ngFor="let item of items">' +
+             '<div *ngFor="let subitem of item">{{subitem}}-{{item.length}};</div>' +
+             '</div>';
          fixture = createTestComponent(template);
 
          getComponent().items = [['a', 'b'], ['c']];
@@ -170,10 +162,11 @@ export function main() {
          detectChangesAndExpectText('e-1;f-2;g-2;');
        }));
 
-    it('should repeat over nested ngIf that are the last node in the ngFor temlate', async(() => {
-         const template =
-             `<div><template ngFor let-item [ngForOf]="items" let-i="index"><div>{{i}}|</div>` +
-             `<div *ngIf="i % 2 == 0">even|</div></template></div>`;
+    it('should repeat over nested ngIf that are the last node in the ngFor template', async(() => {
+         const template = `<div *ngFor="let item of items; let i=index">` +
+             `<div>{{i}}|</div>` +
+             `<div *ngIf="i % 2 == 0">even|</div>` +
+             `</div>`;
 
          fixture = createTestComponent(template);
 
@@ -189,8 +182,7 @@ export function main() {
        }));
 
     it('should display indices correctly', async(() => {
-         const template =
-             '<div><span template="ngFor: let item of items; let i=index">{{i.toString()}}</span></div>';
+         const template = '<span *ngFor ="let item of items; let i=index">{{i.toString()}}</span>';
          fixture = createTestComponent(template);
 
          getComponent().items = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
@@ -202,7 +194,7 @@ export function main() {
 
     it('should display first item correctly', async(() => {
          const template =
-             '<div><span template="ngFor: let item of items; let isFirst=first">{{isFirst.toString()}}</span></div>';
+             '<span *ngFor="let item of items; let isFirst=first">{{isFirst.toString()}}</span>';
          fixture = createTestComponent(template);
 
          getComponent().items = [0, 1, 2];
@@ -214,7 +206,7 @@ export function main() {
 
     it('should display last item correctly', async(() => {
          const template =
-             '<div><span template="ngFor: let item of items; let isLast=last">{{isLast.toString()}}</span></div>';
+             '<span *ngFor="let item of items; let isLast=last">{{isLast.toString()}}</span>';
          fixture = createTestComponent(template);
 
          getComponent().items = [0, 1, 2];
@@ -226,7 +218,7 @@ export function main() {
 
     it('should display even items correctly', async(() => {
          const template =
-             '<div><span template="ngFor: let item of items; let isEven=even">{{isEven.toString()}}</span></div>';
+             '<span *ngFor="let item of items; let isEven=even">{{isEven.toString()}}</span>';
          fixture = createTestComponent(template);
 
          getComponent().items = [0, 1, 2];
@@ -238,7 +230,7 @@ export function main() {
 
     it('should display odd items correctly', async(() => {
          const template =
-             '<div><span template="ngFor: let item of items; let isOdd=odd">{{isOdd.toString()}}</span></div>';
+             '<span *ngFor="let item of items; let isOdd=odd">{{isOdd.toString()}}</span>';
          fixture = createTestComponent(template);
 
          getComponent().items = [0, 1, 2, 3];
@@ -249,64 +241,57 @@ export function main() {
        }));
 
     it('should allow to use a custom template', async(() => {
-         const tcTemplate =
-             '<ul><template ngFor [ngForOf]="items" [ngForTemplate]="contentTpl"></template></ul>';
-         TestBed.overrideComponent(TestComponent, {set: {template: tcTemplate}});
-         const cutTemplate =
-             '<test-cmp><li template="let item; let i=index">{{i}}: {{item}};</li></test-cmp>';
-         TestBed.overrideComponent(ComponentUsingTestComponent, {set: {template: cutTemplate}});
-         fixture = TestBed.createComponent(ComponentUsingTestComponent);
-
-         const testComponent = fixture.debugElement.children[0];
-         testComponent.componentInstance.items = ['a', 'b', 'c'];
+         const template =
+             '<ng-container *ngFor="let item of items; template: tpl"></ng-container>' +
+             '<template let-item let-i="index" #tpl><p>{{i}}: {{item}};</p></template>';
+         fixture = createTestComponent(template);
+         getComponent().items = ['a', 'b', 'c'];
          fixture.detectChanges();
-         expect(testComponent.nativeElement).toHaveText('0: a;1: b;2: c;');
+         detectChangesAndExpectText('0: a;1: b;2: c;');
        }));
 
     it('should use a default template if a custom one is null', async(() => {
-         const testTemplate = `<ul><template ngFor let-item [ngForOf]="items"
-            [ngForTemplate]="contentTpl" let-i="index">{{i}}: {{item}};</template></ul>`;
-         TestBed.overrideComponent(TestComponent, {set: {template: testTemplate}});
-         const cutTemplate =
-             '<test-cmp><li template="let item; let i=index">{{i}}: {{item}};</li></test-cmp>';
-         TestBed.overrideComponent(ComponentUsingTestComponent, {set: {template: cutTemplate}});
-         fixture = TestBed.createComponent(ComponentUsingTestComponent);
-
-         const testComponent = fixture.debugElement.children[0];
-         testComponent.componentInstance.items = ['a', 'b', 'c'];
+         const template =
+             `<ul><ng-container *ngFor="let item of items; template: null; let i=index">{{i}}: {{item}};</ng-container></ul>`;
+         fixture = createTestComponent(template);
+         getComponent().items = ['a', 'b', 'c'];
          fixture.detectChanges();
-         expect(testComponent.nativeElement).toHaveText('0: a;1: b;2: c;');
+         detectChangesAndExpectText('0: a;1: b;2: c;');
        }));
 
     it('should use a custom template when both default and a custom one are present', async(() => {
-         const testTemplate = `<ul><template ngFor let-item [ngForOf]="items"
-         [ngForTemplate]="contentTpl" let-i="index">{{i}}=> {{item}};</template></ul>`;
-         TestBed.overrideComponent(TestComponent, {set: {template: testTemplate}});
-         const cutTemplate =
-             '<test-cmp><li template="let item; let i=index">{{i}}: {{item}};</li></test-cmp>';
-         TestBed.overrideComponent(ComponentUsingTestComponent, {set: {template: cutTemplate}});
-         fixture = TestBed.createComponent(ComponentUsingTestComponent);
-
-         const testComponent = fixture.debugElement.children[0];
-         testComponent.componentInstance.items = ['a', 'b', 'c'];
+         const template =
+             '<ng-container *ngFor="let item of items; template: tpl">{{i}};</ng-container>' +
+             '<template let-item let-i="index" #tpl>{{i}}: {{item}};</template>';
+         fixture = createTestComponent(template);
+         getComponent().items = ['a', 'b', 'c'];
          fixture.detectChanges();
-         expect(testComponent.nativeElement).toHaveText('0: a;1: b;2: c;');
+         detectChangesAndExpectText('0: a;1: b;2: c;');
        }));
 
     describe('track by', () => {
-      it('should throw if trackBy is not a function', async(() => {
-           const template =
-               `<template ngFor let-item [ngForOf]="items" [ngForTrackBy]="item?.id"></template>`;
+      it('should console.warn if trackBy is not a function', async(() => {
+           // TODO(vicb): expect a warning message when we have a proper log service
+           const template = `<p *ngFor="let item of items; trackBy: value"></p>`;
            fixture = createTestComponent(template);
+           fixture.componentInstance.value = 0;
+           fixture.detectChanges();
+         }));
 
-           getComponent().items = [{id: 1}, {id: 2}];
-           expect(() => fixture.detectChanges())
-               .toThrowError(/trackBy must be a function, but received null/);
+      it('should track by identity when trackBy is to `null` or `undefined`', async(() => {
+           // TODO(vicb): expect no warning message when we have a proper log service
+           const template = `<p *ngFor="let item of items; trackBy: value">{{ item }}</p>`;
+           fixture = createTestComponent(template);
+           fixture.componentInstance.items = ['a', 'b', 'c'];
+           fixture.componentInstance.value = null;
+           detectChangesAndExpectText('abc');
+           fixture.componentInstance.value = undefined;
+           detectChangesAndExpectText('abc');
          }));
 
       it('should set the context to the component instance', async(() => {
            const template =
-               `<template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackByContext.bind(this)"></template>`;
+               `<p *ngFor="let item of items; trackBy: trackByContext.bind(this)"></p>`;
            fixture = createTestComponent(template);
 
            thisArg = null;
@@ -316,9 +301,7 @@ export function main() {
 
       it('should not replace tracked items', async(() => {
            const template =
-               `<template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackById" let-i="index">
-               <p>{{items[i]}}</p>
-              </template>`;
+               `<p *ngFor="let item of items; trackBy: trackById; let i=index">{{items[i]}}</p>`;
            fixture = createTestComponent(template);
 
            const buildItemList = () => {
@@ -334,7 +317,7 @@ export function main() {
 
       it('should update implicit local variable on view', async(() => {
            const template =
-               `<div><template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackById">{{item['color']}}</template></div>`;
+               `<div *ngFor="let item of items; trackBy: trackById">{{item['color']}}</div>`;
            fixture = createTestComponent(template);
 
            getComponent().items = [{'id': 'a', 'color': 'blue'}];
@@ -343,9 +326,10 @@ export function main() {
            getComponent().items = [{'id': 'a', 'color': 'red'}];
            detectChangesAndExpectText('red');
          }));
+
       it('should move items around and keep them updated ', async(() => {
            const template =
-               `<div><template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackById">{{item['color']}}</template></div>`;
+               `<div *ngFor="let item of items; trackBy: trackById">{{item['color']}}</div>`;
            fixture = createTestComponent(template);
 
            getComponent().items = [{'id': 'a', 'color': 'blue'}, {'id': 'b', 'color': 'yellow'}];
@@ -356,8 +340,7 @@ export function main() {
          }));
 
       it('should handle added and removed items properly when tracking by index', async(() => {
-           const template =
-               `<div><template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackByIndex">{{item}}</template></div>`;
+           const template = `<div *ngFor="let item of items; trackBy: trackByIndex">{{item}}</div>`;
            fixture = createTestComponent(template);
 
            getComponent().items = ['a', 'b', 'c', 'd'];
@@ -377,21 +360,16 @@ class Foo {
 
 @Component({selector: 'test-cmp', template: ''})
 class TestComponent {
-  @ContentChild(TemplateRef) contentTpl: TemplateRef<Object>;
+  value: any;
   items: any[] = [1, 2];
   trackById(index: number, item: any): string { return item['id']; }
   trackByIndex(index: number, item: any): number { return index; }
   trackByContext(): void { thisArg = this; }
 }
 
-@Component({selector: 'outer-cmp', template: ''})
-class ComponentUsingTestComponent {
-  items: any = [1, 2];
-}
-
-const TEMPLATE = '<div><span template="ngFor let item of items">{{item.toString()}};</span></div>';
+const TEMPLATE = '<div><span *ngFor="let item of items">{{item.toString()}};</span></div>';
 
 function createTestComponent(template: string = TEMPLATE): ComponentFixture<TestComponent> {
   return TestBed.overrideComponent(TestComponent, {set: {template: template}})
       .createComponent(TestComponent);
-}
+}

modules/@angular/common/test/directives/ng_if_spec.ts

@@ -9,6 +9,7 @@
 import {CommonModule} from '@angular/common';
 import {Component} from '@angular/core';
 import {ComponentFixture, TestBed, async} from '@angular/core/testing';
+import {By} from '@angular/platform-browser/src/dom/debug/by';
 import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
 import {expect} from '@angular/platform-browser/testing/matchers';
 
@@ -28,138 +29,119 @@ export function main() {
     });
 
     it('should work in a template attribute', async(() => {
-         const template = '<div><span template="ngIf booleanCondition">hello</span></div>';
+         const template = '<span *ngIf="booleanCondition">hello</span>';
          fixture = createTestComponent(template);
-
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(1);
          expect(fixture.nativeElement).toHaveText('hello');
        }));
 
-    it('should work in a template element', async(() => {
-         const template =
-             '<div><template [ngIf]="booleanCondition"><span>hello2</span></template></div>';
-
+    it('should work on a template element', async(() => {
+         const template = '<template [ngIf]="booleanCondition">hello2</template>';
          fixture = createTestComponent(template);
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
          expect(fixture.nativeElement).toHaveText('hello2');
        }));
 
     it('should toggle node when condition changes', async(() => {
-         const template = '<div><span template="ngIf booleanCondition">hello</span></div>';
-
+         const template = '<span *ngIf="booleanCondition">hello</span>';
          fixture = createTestComponent(template);
          getComponent().booleanCondition = false;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(0);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(0);
          expect(fixture.nativeElement).toHaveText('');
 
          getComponent().booleanCondition = true;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(1);
          expect(fixture.nativeElement).toHaveText('hello');
 
          getComponent().booleanCondition = false;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(0);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(0);
          expect(fixture.nativeElement).toHaveText('');
        }));
 
     it('should handle nested if correctly', async(() => {
          const template =
-             '<div><template [ngIf]="booleanCondition"><span *ngIf="nestedBooleanCondition">hello</span></template></div>';
+             '<div *ngIf="booleanCondition"><span *ngIf="nestedBooleanCondition">hello</span></div>';
 
          fixture = createTestComponent(template);
 
          getComponent().booleanCondition = false;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(0);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(0);
          expect(fixture.nativeElement).toHaveText('');
 
          getComponent().booleanCondition = true;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(1);
          expect(fixture.nativeElement).toHaveText('hello');
 
          getComponent().nestedBooleanCondition = false;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(0);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(0);
          expect(fixture.nativeElement).toHaveText('');
 
          getComponent().nestedBooleanCondition = true;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(1);
          expect(fixture.nativeElement).toHaveText('hello');
 
          getComponent().booleanCondition = false;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(0);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(0);
          expect(fixture.nativeElement).toHaveText('');
        }));
 
     it('should update several nodes with if', async(() => {
-         const template = '<div>' +
-             '<span template="ngIf numberCondition + 1 >= 2">helloNumber</span>' +
-             '<span template="ngIf stringCondition == \'foo\'">helloString</span>' +
-             '<span template="ngIf functionCondition(stringCondition, numberCondition)">helloFunction</span>' +
-             '</div>';
+         const template = '<span *ngIf="numberCondition + 1 >= 2">helloNumber</span>' +
+             '<span *ngIf="stringCondition == \'foo\'">helloString</span>' +
+             '<span *ngIf="functionCondition(stringCondition, numberCondition)">helloFunction</span>';
 
          fixture = createTestComponent(template);
 
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(3);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(3);
          expect(getDOM().getText(fixture.nativeElement))
              .toEqual('helloNumberhelloStringhelloFunction');
 
          getComponent().numberCondition = 0;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(1);
          expect(fixture.nativeElement).toHaveText('helloString');
 
          getComponent().numberCondition = 1;
          getComponent().stringCondition = 'bar';
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
+         expect(fixture.debugElement.queryAll(By.css('span')).length).toEqual(1);
          expect(fixture.nativeElement).toHaveText('helloNumber');
        }));
 
-    it('should not add the element twice if the condition goes from true to true (JS)',
-       async(() => {
-         const template = '<div><span template="ngIf numberCondition">hello</span></div>';
+    it('should not add the element twice if the condition goes from truthy to truthy', async(() => {
+         const template = '<span *ngIf="numberCondition">hello</span>';
 
          fixture = createTestComponent(template);
 
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
+         let els = fixture.debugElement.queryAll(By.css('span'));
+         expect(els.length).toEqual(1);
+         getDOM().addClass(els[0].nativeElement, 'marker');
          expect(fixture.nativeElement).toHaveText('hello');
 
          getComponent().numberCondition = 2;
          fixture.detectChanges();
-         expect(getDOM().querySelectorAll(fixture.nativeElement, 'span').length).toEqual(1);
+         els = fixture.debugElement.queryAll(By.css('span'));
+         expect(els.length).toEqual(1);
+         expect(getDOM().hasClass(els[0].nativeElement, 'marker')).toBe(true);
+
          expect(fixture.nativeElement).toHaveText('hello');
        }));
 
-    it('should not recreate the element if the condition goes from true to true (JS)', async(() => {
-         const template = '<div><span template="ngIf numberCondition">hello</span></div>';
-
-         fixture = createTestComponent(template);
-
-         fixture.detectChanges();
-         getDOM().addClass(getDOM().querySelector(fixture.nativeElement, 'span'), 'foo');
-
-         getComponent().numberCondition = 2;
-         fixture.detectChanges();
-         expect(getDOM().hasClass(getDOM().querySelector(fixture.nativeElement, 'span'), 'foo'))
-             .toBe(true);
-       }));
-
     describe('else', () => {
       it('should support else', async(() => {
-           const template = '<div>' +
-               '<span *ngIf="booleanCondition; else elseBlock">TRUE</span>' +
-               '<template #elseBlock>FALSE</template>' +
-               '</div>';
+           const template = '<span *ngIf="booleanCondition; else elseBlock">TRUE</span>' +
+               '<template #elseBlock>FALSE</template>';
 
            fixture = createTestComponent(template);
 
@@ -172,11 +154,10 @@ export function main() {
          }));
 
       it('should support then and else', async(() => {
-           const template = '<div>' +
+           const template =
                '<span *ngIf="booleanCondition; then thenBlock; else elseBlock">IGNORE</span>' +
                '<template #thenBlock>THEN</template>' +
-               '<template #elseBlock>ELSE</template>' +
-               '</div>';
+               '<template #elseBlock>ELSE</template>';
 
            fixture = createTestComponent(template);
 
@@ -189,11 +170,10 @@ export function main() {
          }));
 
       it('should support dynamic else', async(() => {
-           const template = '<div>' +
+           const template =
                '<span *ngIf="booleanCondition; else nestedBooleanCondition ? b1 : b2">TRUE</span>' +
                '<template #b1>FALSE1</template>' +
-               '<template #b2>FALSE2</template>' +
-               '</div>';
+               '<template #b2>FALSE2</template>';
 
            fixture = createTestComponent(template);
 
@@ -210,10 +190,8 @@ export function main() {
          }));
 
       it('should support binding to variable', async(() => {
-           const template = '<div>' +
-               '<span *ngIf="booleanCondition; else elseBlock; let v">{{v}}</span>' +
-               '<template #elseBlock let-v>{{v}}</template>' +
-               '</div>';
+           const template = '<span *ngIf="booleanCondition; else elseBlock; let v">{{v}}</span>' +
+               '<template #elseBlock let-v>{{v}}</template>';
 
            fixture = createTestComponent(template);
 

modules/@angular/common/test/directives/ng_plural_spec.ts

@@ -33,11 +33,10 @@ export function main() {
     });
 
     it('should display the template according to the exact value', async(() => {
-         const template = '<div>' +
-             '<ul [ngPlural]="switchValue">' +
+         const template = '<ul [ngPlural]="switchValue">' +
              '<template ngPluralCase="=0"><li>you have no messages.</li></template>' +
              '<template ngPluralCase="=1"><li>you have one message.</li></template>' +
-             '</ul></div>';
+             '</ul>';
 
          fixture = createTestComponent(template);
 
@@ -51,10 +50,9 @@ export function main() {
     // https://github.com/angular/angular/issues/9868
     // https://github.com/angular/angular/issues/9882
     it('should not throw when ngPluralCase contains expressions', async(() => {
-         const template = '<div>' +
-             '<ul [ngPlural]="switchValue">' +
+         const template = '<ul [ngPlural]="switchValue">' +
              '<template ngPluralCase="=0"><li>{{ switchValue }}</li></template>' +
-             '</ul></div>';
+             '</ul>';
 
          fixture = createTestComponent(template);
 
@@ -64,11 +62,10 @@ export function main() {
 
 
     it('should be applicable to <ng-container> elements', async(() => {
-         const template = '<div>' +
-             '<ng-container [ngPlural]="switchValue">' +
+         const template = '<ng-container [ngPlural]="switchValue">' +
              '<template ngPluralCase="=0">you have no messages.</template>' +
              '<template ngPluralCase="=1">you have one message.</template>' +
-             '</ng-container></div>';
+             '</ng-container>';
 
          fixture = createTestComponent(template);
 
@@ -80,11 +77,10 @@ export function main() {
        }));
 
     it('should display the template according to the category', async(() => {
-         const template = '<div>' +
-             '<ul [ngPlural]="switchValue">' +
+         const template = '<ul [ngPlural]="switchValue">' +
              '<template ngPluralCase="few"><li>you have a few messages.</li></template>' +
              '<template ngPluralCase="many"><li>you have many messages.</li></template>' +
-             '</ul></div>';
+             '</ul>';
 
          fixture = createTestComponent(template);
 
@@ -96,11 +92,10 @@ export function main() {
        }));
 
     it('should default to other when no matches are found', async(() => {
-         const template = '<div>' +
-             '<ul [ngPlural]="switchValue">' +
+         const template = '<ul [ngPlural]="switchValue">' +
              '<template ngPluralCase="few"><li>you have a few messages.</li></template>' +
              '<template ngPluralCase="other"><li>default message.</li></template>' +
-             '</ul></div>';
+             '</ul>';
 
          fixture = createTestComponent(template);
 
@@ -109,11 +104,10 @@ export function main() {
        }));
 
     it('should prioritize value matches over category matches', async(() => {
-         const template = '<div>' +
-             '<ul [ngPlural]="switchValue">' +
+         const template = '<ul [ngPlural]="switchValue">' +
              '<template ngPluralCase="few"><li>you have a few messages.</li></template>' +
              '<template ngPluralCase="=2">you have two messages.</template>' +
-             '</ul></div>';
+             '</ul>';
 
          fixture = createTestComponent(template);
 

modules/@angular/common/test/directives/ng_style_spec.ts

@@ -29,22 +29,19 @@ export function main() {
     it('should add styles specified in an object literal', async(() => {
          const template = `<div [ngStyle]="{'max-width': '40px'}"></div>`;
          fixture = createTestComponent(template);
-
          fixture.detectChanges();
          expectNativeEl(fixture).toHaveCssStyle({'max-width': '40px'});
        }));
 
     it('should add and change styles specified in an object expression', async(() => {
          const template = `<div [ngStyle]="expr"></div>`;
-
          fixture = createTestComponent(template);
-         let expr: {[k: string]: string};
 
          getComponent().expr = {'max-width': '40px'};
          fixture.detectChanges();
          expectNativeEl(fixture).toHaveCssStyle({'max-width': '40px'});
 
-         expr = getComponent().expr;
+         let expr = getComponent().expr;
          expr['max-width'] = '30%';
          fixture.detectChanges();
          expectNativeEl(fixture).toHaveCssStyle({'max-width': '30%'});

modules/@angular/common/test/directives/ng_switch_spec.ts

@@ -33,11 +33,10 @@ export function main() {
 
     describe('switch value changes', () => {
       it('should switch amongst when values', () => {
-        const template = '<div>' +
-            '<ul [ngSwitch]="switchValue">' +
-            '<template ngSwitchCase="a"><li>when a</li></template>' +
-            '<template ngSwitchCase="b"><li>when b</li></template>' +
-            '</ul></div>';
+        const template = '<ul [ngSwitch]="switchValue">' +
+            '<li *ngSwitchCase="\'a\'">when a</li>' +
+            '<li *ngSwitchCase="\'b\'">when b</li>' +
+            '</ul>';
 
         fixture = createTestComponent(template);
 
@@ -51,11 +50,10 @@ export function main() {
       });
 
       it('should switch amongst when values with fallback to default', () => {
-        const template = '<div>' +
-            '<ul [ngSwitch]="switchValue">' +
-            '<li template="ngSwitchCase \'a\'">when a</li>' +
-            '<li template="ngSwitchDefault">when default</li>' +
-            '</ul></div>';
+        const template = '<ul [ngSwitch]="switchValue">' +
+            '<li *ngSwitchCase="\'a\'">when a</li>' +
+            '<li *ngSwitchDefault>when default</li>' +
+            '</ul>';
 
         fixture = createTestComponent(template);
         detectChangesAndExpectText('when default');
@@ -71,15 +69,14 @@ export function main() {
       });
 
       it('should support multiple whens with the same value', () => {
-        const template = '<div>' +
-            '<ul [ngSwitch]="switchValue">' +
-            '<template ngSwitchCase="a"><li>when a1;</li></template>' +
-            '<template ngSwitchCase="b"><li>when b1;</li></template>' +
-            '<template ngSwitchCase="a"><li>when a2;</li></template>' +
-            '<template ngSwitchCase="b"><li>when b2;</li></template>' +
-            '<template ngSwitchDefault><li>when default1;</li></template>' +
-            '<template ngSwitchDefault><li>when default2;</li></template>' +
-            '</ul></div>';
+        const template = '<ul [ngSwitch]="switchValue">' +
+            '<li *ngSwitchCase="\'a\'">when a1;</li>' +
+            '<li *ngSwitchCase="\'b\'">when b1;</li>' +
+            '<li *ngSwitchCase="\'a\'">when a2;</li>' +
+            '<li *ngSwitchCase="\'b\'">when b2;</li>' +
+            '<li *ngSwitchDefault>when default1;</li>' +
+            '<li *ngSwitchDefault>when default2;</li>' +
+            '</ul>';
 
         fixture = createTestComponent(template);
         detectChangesAndExpectText('when default1;when default2;');
@@ -94,12 +91,11 @@ export function main() {
 
     describe('when values changes', () => {
       it('should switch amongst when values', () => {
-        const template = '<div>' +
-            '<ul [ngSwitch]="switchValue">' +
-            '<template [ngSwitchCase]="when1"><li>when 1;</li></template>' +
-            '<template [ngSwitchCase]="when2"><li>when 2;</li></template>' +
-            '<template ngSwitchDefault><li>when default;</li></template>' +
-            '</ul></div>';
+        const template = '<ul [ngSwitch]="switchValue">' +
+            '<li *ngSwitchCase="when1">when 1;</li>' +
+            '<li *ngSwitchCase="when2">when 2;</li>' +
+            '<li *ngSwitchDefault>when default;</li>' +
+            '</ul>';
 
         fixture = createTestComponent(template);
         getComponent().when1 = 'a';
@@ -148,11 +144,10 @@ export function main() {
       });
 
       it('should create the default case if there is no other case', () => {
-        const template = '<div>' +
-            '<ul [ngSwitch]="switchValue">' +
-            '<template ngSwitchDefault><li>when default1;</li></template>' +
-            '<template ngSwitchDefault><li>when default2;</li></template>' +
-            '</ul></div>';
+        const template = '<ul [ngSwitch]="switchValue">' +
+            '<li *ngSwitchDefault>when default1;</li>' +
+            '<li *ngSwitchDefault>when default2;</li>' +
+            '</ul>';
 
         fixture = createTestComponent(template);
         detectChangesAndExpectText('when default1;when default2;');
@@ -160,15 +155,14 @@ export function main() {
       });
 
       it('should allow defaults before cases', () => {
-        const template = '<div>' +
-            '<ul [ngSwitch]="switchValue">' +
-            '<template ngSwitchDefault><li>when default1;</li></template>' +
-            '<template ngSwitchDefault><li>when default2;</li></template>' +
-            '<template ngSwitchCase="a"><li>when a1;</li></template>' +
-            '<template ngSwitchCase="b"><li>when b1;</li></template>' +
-            '<template ngSwitchCase="a"><li>when a2;</li></template>' +
-            '<template ngSwitchCase="b"><li>when b2;</li></template>' +
-            '</ul></div>';
+        const template = '<ul [ngSwitch]="switchValue">' +
+            '<li *ngSwitchDefault>when default1;</li>' +
+            '<li *ngSwitchDefault>when default2;</li>' +
+            '<li *ngSwitchCase="\'a\'">when a1;</li>' +
+            '<li *ngSwitchCase="\'b\'">when b1;</li>' +
+            '<li *ngSwitchCase="\'a\'">when a2;</li>' +
+            '<li *ngSwitchCase="\'b\'">when b2;</li>' +
+            '</ul>';
 
         fixture = createTestComponent(template);
         detectChangesAndExpectText('when default1;when default2;');

modules/@angular/common/test/directives/ng_template_outlet_spec.ts

@@ -34,29 +34,22 @@ export function main() {
       });
     });
 
-    it('should do nothing if templateRef is null', async(() => {
-         const template = `<template [ngTemplateOutlet]="null"></template>`;
+    it('should do nothing if templateRef is `null`', async(() => {
+         const template = `<ng-container [ngTemplateOutlet]="null"></ng-container>`;
          fixture = createTestComponent(template);
-
          detectChangesAndExpectText('');
        }));
 
     it('should insert content specified by TemplateRef', async(() => {
-         const template =
-             `<tpl-refs #refs="tplRefs"><template>foo</template></tpl-refs><template [ngTemplateOutlet]="currentTplRef"></template>`;
+         const template = `<template #tpl>foo</template>` +
+             `<ng-container [ngTemplateOutlet]="tpl"></ng-container>`;
          fixture = createTestComponent(template);
-
-         detectChangesAndExpectText('');
-
-         const refs = fixture.debugElement.children[0].references['refs'];
-
-         setTplRef(refs.tplRefs.first);
          detectChangesAndExpectText('foo');
        }));
 
-    it('should clear content if TemplateRef becomes null', async(() => {
-         const template =
-             `<tpl-refs #refs="tplRefs"><template>foo</template></tpl-refs><template [ngTemplateOutlet]="currentTplRef"></template>`;
+    it('should clear content if TemplateRef becomes `null`', async(() => {
+         const template = `<tpl-refs #refs="tplRefs"><template>foo</template></tpl-refs>` +
+             `<ng-container [ngTemplateOutlet]="currentTplRef"></ng-container>`;
          fixture = createTestComponent(template);
          fixture.detectChanges();
          const refs = fixture.debugElement.children[0].references['refs'];
@@ -70,7 +63,8 @@ export function main() {
 
     it('should swap content if TemplateRef changes', async(() => {
          const template =
-             `<tpl-refs #refs="tplRefs"><template>foo</template><template>bar</template></tpl-refs><template [ngTemplateOutlet]="currentTplRef"></template>`;
+             `<tpl-refs #refs="tplRefs"><template>foo</template><template>bar</template></tpl-refs>` +
+             `<ng-container [ngTemplateOutlet]="currentTplRef"></ng-container>`;
          fixture = createTestComponent(template);
 
          fixture.detectChanges();
@@ -83,70 +77,47 @@ export function main() {
          detectChangesAndExpectText('bar');
        }));
 
-    it('should display template if context is null', async(() => {
-         const template =
-             `<tpl-refs #refs="tplRefs"><template>foo</template></tpl-refs><template [ngTemplateOutlet]="currentTplRef" [ngOutletContext]="null"></template>`;
+    it('should display template if context is `null`', async(() => {
+         const template = `<template #tpl>foo</template>` +
+             `<ng-container *ngTemplateOutlet="tpl; context: null"></ng-container>`;
          fixture = createTestComponent(template);
-         detectChangesAndExpectText('');
-
-         const refs = fixture.debugElement.children[0].references['refs'];
-
-         setTplRef(refs.tplRefs.first);
          detectChangesAndExpectText('foo');
        }));
 
     it('should reflect initial context and changes', async(() => {
-         const template =
-             `<tpl-refs #refs="tplRefs"><template let-foo="foo"><span>{{foo}}</span></template></tpl-refs><template [ngTemplateOutlet]="currentTplRef" [ngOutletContext]="context"></template>`;
+         const template = `<template let-foo="foo" #tpl>{{foo}}</template>` +
+             `<ng-container *ngTemplateOutlet="tpl; context: context"></ng-container>`;
          fixture = createTestComponent(template);
 
          fixture.detectChanges();
-
-         const refs = fixture.debugElement.children[0].references['refs'];
-         setTplRef(refs.tplRefs.first);
-
          detectChangesAndExpectText('bar');
 
          fixture.componentInstance.context.foo = 'alter-bar';
-
          detectChangesAndExpectText('alter-bar');
        }));
 
-    it('should reflect user defined $implicit property in the context', async(() => {
-         const template =
-             `<tpl-refs #refs="tplRefs"><template let-ctx><span>{{ctx.foo}}</span></template></tpl-refs><template [ngTemplateOutlet]="currentTplRef" [ngOutletContext]="context"></template>`;
+    it('should reflect user defined `$implicit` property in the context', async(() => {
+         const template = `<template let-ctx #tpl>{{ctx.foo}}</template>` +
+             `<ng-container *ngTemplateOutlet="tpl; context: context"></ng-container>`;
          fixture = createTestComponent(template);
-
-         fixture.detectChanges();
-
-         const refs = fixture.debugElement.children[0].references['refs'];
-         setTplRef(refs.tplRefs.first);
-
-         fixture.componentInstance.context = {$implicit: fixture.componentInstance.context};
-         detectChangesAndExpectText('bar');
+         fixture.componentInstance.context = {$implicit: {foo: 'bra'}};
+         detectChangesAndExpectText('bra');
        }));
 
     it('should reflect context re-binding', async(() => {
-         const template =
-             `<tpl-refs #refs="tplRefs"><template let-shawshank="shawshank"><span>{{shawshank}}</span></template></tpl-refs><template [ngTemplateOutlet]="currentTplRef" [ngOutletContext]="context"></template>`;
+         const template = `<template let-shawshank="shawshank" #tpl>{{shawshank}}</template>` +
+             `<ng-container *ngTemplateOutlet="tpl; context: context"></ng-container>`;
          fixture = createTestComponent(template);
 
-         fixture.detectChanges();
-
-         const refs = fixture.debugElement.children[0].references['refs'];
-         setTplRef(refs.tplRefs.first);
          fixture.componentInstance.context = {shawshank: 'brooks'};
-
          detectChangesAndExpectText('brooks');
 
          fixture.componentInstance.context = {shawshank: 'was here'};
-
          detectChangesAndExpectText('was here');
        }));
   });
 }
 
-
 @Directive({selector: 'tpl-refs', exportAs: 'tplRefs'})
 class CaptureTplRefs {
   @ContentChildren(TemplateRef) tplRefs: QueryList<TemplateRef<any>>;
@@ -162,4 +133,4 @@ function createTestComponent(template: string): ComponentFixture<TestComponent>
   return TestBed.overrideComponent(TestComponent, {set: {template: template}})
       .configureTestingModule({schemas: [NO_ERRORS_SCHEMA]})
       .createComponent(TestComponent);
-}
+}

modules/@angular/compiler-cli/integrationtest/ngtools_src/feature/lazy-feature-nested.module.ts

@@ -0,0 +1,23 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import {Component, NgModule} from '@angular/core';
+import {RouterModule} from '@angular/router';
+
+@Component({selector: 'lazy-feature-comp', template: 'lazy feature, nested!'})
+export class LazyFeatureNestedComponent {
+}
+
+@NgModule({
+  imports: [RouterModule.forChild([
+    {path: '', component: LazyFeatureNestedComponent, pathMatch: 'full'},
+  ])],
+  declarations: [LazyFeatureNestedComponent]
+})
+export class LazyFeatureNestedModule {
+}

modules/@angular/compiler-cli/integrationtest/ngtools_src/feature/lazy-feature.module.ts

@@ -16,7 +16,10 @@ export class LazyFeatureComponent {
 @NgModule({
   imports: [RouterModule.forChild([
     {path: '', component: LazyFeatureComponent, pathMatch: 'full'},
-    {path: 'feature', loadChildren: './feature.module#FeatureModule'}
+    {path: 'feature', loadChildren: './feature.module#FeatureModule'}, {
+      path: 'nested-feature',
+      loadChildren: './lazy-feature-nested.module#LazyFeatureNestedModule'
+    }
   ])],
   declarations: [LazyFeatureComponent]
 })

modules/@angular/compiler-cli/integrationtest/src/animate.ts

@@ -8,6 +8,10 @@
 
 import {AUTO_STYLE, Component, animate, state, style, transition, trigger} from '@angular/core';
 
+export function anyToAny(stateA: string, stateB: string): boolean {
+  return Math.random() != Math.random();
+}
+
 @Component({
   selector: 'animate-cmp',
   animations: [trigger(
@@ -16,7 +20,7 @@ import {AUTO_STYLE, Component, animate, state, style, transition, trigger} from
         state('*', style({height: AUTO_STYLE, color: 'black', borderColor: 'black'})),
         state('closed, void', style({height: '0px', color: 'maroon', borderColor: 'maroon'})),
         state('open', style({height: AUTO_STYLE, borderColor: 'green', color: 'green'})),
-        transition('* => *', animate(500))
+        transition(anyToAny, animate('1s')), transition('* => *', animate(500))
       ])],
   template: `
     <button (click)="setAsOpen()">Open</button>

modules/@angular/compiler-cli/integrationtest/test/test_ngtools_api.ts

@@ -191,6 +191,8 @@ function lazyRoutesTest() {
     './lazy.module#LazyModule': 'lazy.module.ts',
     './feature/feature.module#FeatureModule': 'feature/feature.module.ts',
     './feature/lazy-feature.module#LazyFeatureModule': 'feature/lazy-feature.module.ts',
+    './feature.module#FeatureModule': 'feature/feature.module.ts',
+    './lazy-feature-nested.module#LazyFeatureNestedModule': 'feature/lazy-feature-nested.module.ts',
     'feature2/feature2.module#Feature2Module': 'feature2/feature2.module.ts',
     './default.module': 'feature2/default.module.ts',
     'feature/feature.module#FeatureModule': 'feature/feature.module.ts'

modules/@angular/compiler-cli/integrationtest/third_party_src/tsconfig-build.json

@@ -15,6 +15,8 @@
     "declaration": true,
     "lib": ["es6", "dom"],
     "baseUrl": ".",
-    "outDir": "../node_modules/third_party"
-  }
+    "outDir": "../node_modules/third_party",
+     // Prevent scanning up the directory tree for types
+    "typeRoots": ["node_modules/@types"]
+ }
 }

modules/@angular/compiler-cli/integrationtest/tsconfig-build.json

@@ -14,7 +14,9 @@
     "rootDir": "",
     "declaration": true,
     "lib": ["es6", "dom"],
-    "baseUrl": "."
+    "baseUrl": ".",
+    // Prevent scanning up the directory tree for types
+    "typeRoots": ["node_modules/@types"]
   },
 
   "files": [

modules/@angular/compiler-cli/package.json

@@ -9,7 +9,7 @@
     "ng-xi18n": "./src/extract_i18n.js"
   },
   "dependencies": {
-    "@angular/tsc-wrapped": "0.5.0",
+    "@angular/tsc-wrapped": "4.0.0-beta.2",
     "reflect-metadata": "^0.1.2",
     "minimist": "^1.2.0"
   },

modules/@angular/compiler-cli/src/codegen.ts

@@ -11,7 +11,6 @@
  * Intended to be used in a build step.
  */
 import * as compiler from '@angular/compiler';
-import {ViewEncapsulation} from '@angular/core';
 import {AngularCompilerOptions, NgcCliOptions} from '@angular/tsc-wrapped';
 import {readFileSync} from 'fs';
 import * as path from 'path';
@@ -19,7 +18,6 @@ import * as ts from 'typescript';
 
 import {CompilerHost, CompilerHostContext, ModuleResolutionHostAdapter} from './compiler_host';
 import {PathMappedCompilerHost} from './path_mapped_compiler_host';
-import {Console} from './private_import_core';
 
 const GENERATED_META_FILES = /\.json$/;
 

modules/@angular/compiler-cli/src/ngtools_impl.ts

@@ -15,8 +15,6 @@
 import {AotCompilerHost, StaticReflector, StaticSymbol} from '@angular/compiler';
 import {NgModule} from '@angular/core';
 
-
-
 // We cannot depend directly to @angular/router.
 type Route = any;
 const ROUTER_MODULE_PATH = '@angular/router/src/router_config_loader';
@@ -63,29 +61,37 @@ export function listLazyRoutesOfModule(
   const className = entryRouteDef.className;
 
   // List loadChildren of this single module.
-  const staticSymbol = reflector.findDeclaration(modulePath, className, containingFile);
+  const appStaticSymbol = reflector.findDeclaration(modulePath, className, containingFile);
   const ROUTES = reflector.findDeclaration(ROUTER_MODULE_PATH, ROUTER_ROUTES_SYMBOL_NAME);
   const lazyRoutes: LazyRoute[] =
-      _extractLazyRoutesFromStaticModule(staticSymbol, reflector, host, ROUTES);
-  const routes: LazyRouteMap = {};
+      _extractLazyRoutesFromStaticModule(appStaticSymbol, reflector, host, ROUTES);
 
-  lazyRoutes.forEach((lazyRoute: LazyRoute) => {
-    const route: string = lazyRoute.routeDef.toString();
-    _assertRoute(routes, lazyRoute);
-    routes[route] = lazyRoute;
+  const allLazyRoutes = lazyRoutes.reduce(
+      function includeLazyRouteAndSubRoutes(allRoutes: LazyRouteMap, lazyRoute: LazyRoute):
+          LazyRouteMap {
+            const route: string = lazyRoute.routeDef.toString();
+            _assertRoute(allRoutes, lazyRoute);
+            allRoutes[route] = lazyRoute;
 
-    const lazyModuleSymbol = reflector.findDeclaration(
-        lazyRoute.absoluteFilePath, lazyRoute.routeDef.className || 'default');
-    const subRoutes = _extractLazyRoutesFromStaticModule(lazyModuleSymbol, reflector, host, ROUTES);
+            // StaticReflector does not support discovering annotations like `NgModule` on default
+            // exports
+            // Which means: if a default export NgModule was lazy-loaded, we can discover it, but,
+            //  we cannot parse its routes to see if they have loadChildren or not.
+            if (!lazyRoute.routeDef.className) {
+              return allRoutes;
+            }
 
-    // Populate the map using the routes we just found.
-    subRoutes.forEach(subRoute => {
-      _assertRoute(routes, subRoute);
-      routes[subRoute.routeDef.toString()] = subRoute;
-    });
-  });
+            const lazyModuleSymbol = reflector.findDeclaration(
+                lazyRoute.absoluteFilePath, lazyRoute.routeDef.className || 'default');
 
-  return routes;
+            const subRoutes =
+                _extractLazyRoutesFromStaticModule(lazyModuleSymbol, reflector, host, ROUTES);
+
+            return subRoutes.reduce(includeLazyRouteAndSubRoutes, allRoutes);
+          },
+      {});
+
+  return allLazyRoutes;
 }
 
 
@@ -192,7 +198,7 @@ function _collectRoutes(
  */
 function _collectLoadChildren(routes: Route[]): string[] {
   return routes.reduce((m, r) => {
-    if (r.loadChildren) {
+    if (r.loadChildren && typeof r.loadChildren === 'string') {
       return m.concat(r.loadChildren);
     } else if (Array.isArray(r)) {
       return m.concat(_collectLoadChildren(r));

modules/@angular/compiler-cli/src/private_import_core.ts

@@ -9,10 +9,10 @@
 import {__core_private__ as r} from '@angular/core';
 
 export type ReflectorReader = typeof r._ReflectorReader;
-export var ReflectorReader: typeof r.ReflectorReader = r.ReflectorReader;
+export const ReflectorReader: typeof r.ReflectorReader = r.ReflectorReader;
 
 export type ReflectionCapabilities = typeof r._ReflectionCapabilities;
-export var ReflectionCapabilities: typeof r.ReflectionCapabilities = r.ReflectionCapabilities;
+export const ReflectionCapabilities: typeof r.ReflectionCapabilities = r.ReflectionCapabilities;
 
 export type Console = typeof r._Console;
-export var Console: typeof r.Console = r.Console;
+export const Console: typeof r.Console = r.Console;

modules/@angular/compiler-cli/test/mocks.ts

@@ -122,11 +122,9 @@ export class MockCompilerHost implements ts.CompilerHost {
     return ts.getDefaultLibFileName(options);
   }
 
-  writeFile: ts.WriteFileCallback = (fileName, text) => { this.context.writeFile(fileName, text); }
+  writeFile: ts.WriteFileCallback = (fileName, text) => { this.context.writeFile(fileName, text); };
 
-  getCurrentDirectory(): string {
-    return this.context.currentDirectory;
-  }
+  getCurrentDirectory(): string { return this.context.currentDirectory; }
 
   getCanonicalFileName(fileName: string): string { return fileName; }
 

modules/@angular/compiler-cli/test/private_import_core.ts

@@ -9,5 +9,5 @@
 import {__core_private__ as r} from '@angular/core';
 
 export type ReflectionCapabilities = typeof r._ReflectionCapabilities;
-export var ReflectionCapabilities: typeof r.ReflectionCapabilities = r.ReflectionCapabilities;
-export var reflector: typeof r.reflector = r.reflector;
+export const ReflectionCapabilities: typeof r.ReflectionCapabilities = r.ReflectionCapabilities;
+export const reflector: typeof r.reflector = r.reflector;

modules/@angular/compiler/src/animation/animation_ast.ts

@@ -5,6 +5,7 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
+import {StaticSymbol} from '../aot/static_symbol';
 
 export abstract class AnimationAst {
   public startTime: number = 0;
@@ -49,6 +50,10 @@ export class AnimationStateTransitionExpression {
   constructor(public fromState: string, public toState: string) {}
 }
 
+export class AnimationStateTransitionFnExpression extends AnimationStateTransitionExpression {
+  constructor(public fn: Function|StaticSymbol) { super(null, null); }
+}
+
 export class AnimationStateTransitionAst extends AnimationStateAst {
   constructor(
       public stateChanges: AnimationStateTransitionExpression[],

modules/@angular/compiler/src/animation/animation_compiler.ts

@@ -12,7 +12,7 @@ import {Identifiers, createIdentifier} from '../identifiers';
 import * as o from '../output/output_ast';
 import {ANY_STATE, DEFAULT_STATE, EMPTY_STATE} from '../private_import_core';
 
-import {AnimationAst, AnimationAstVisitor, AnimationEntryAst, AnimationGroupAst, AnimationKeyframeAst, AnimationSequenceAst, AnimationStateDeclarationAst, AnimationStateTransitionAst, AnimationStepAst, AnimationStylesAst} from './animation_ast';
+import {AnimationAst, AnimationAstVisitor, AnimationEntryAst, AnimationGroupAst, AnimationKeyframeAst, AnimationSequenceAst, AnimationStateDeclarationAst, AnimationStateTransitionAst, AnimationStateTransitionFnExpression, AnimationStepAst, AnimationStylesAst} from './animation_ast';
 
 export class AnimationEntryCompileResult {
   constructor(public name: string, public statements: o.Statement[], public fnExp: o.Expression) {}
@@ -162,16 +162,22 @@ class _AnimationBuilder implements AnimationAstVisitor {
     const stateChangePreconditions: o.Expression[] = [];
 
     ast.stateChanges.forEach(stateChange => {
-      stateChangePreconditions.push(
-          _compareToAnimationStateExpr(_ANIMATION_CURRENT_STATE_VAR, stateChange.fromState)
-              .and(_compareToAnimationStateExpr(_ANIMATION_NEXT_STATE_VAR, stateChange.toState)));
+      if (stateChange instanceof AnimationStateTransitionFnExpression) {
+        stateChangePreconditions.push(o.importExpr({reference: stateChange.fn}).callFn([
+          _ANIMATION_CURRENT_STATE_VAR, _ANIMATION_NEXT_STATE_VAR
+        ]));
+      } else {
+        stateChangePreconditions.push(
+            _compareToAnimationStateExpr(_ANIMATION_CURRENT_STATE_VAR, stateChange.fromState)
+                .and(_compareToAnimationStateExpr(_ANIMATION_NEXT_STATE_VAR, stateChange.toState)));
 
-      if (stateChange.fromState != ANY_STATE) {
-        context.stateMap.registerState(stateChange.fromState);
-      }
+        if (stateChange.fromState != ANY_STATE) {
+          context.stateMap.registerState(stateChange.fromState);
+        }
 
-      if (stateChange.toState != ANY_STATE) {
-        context.stateMap.registerState(stateChange.toState);
+        if (stateChange.toState != ANY_STATE) {
+          context.stateMap.registerState(stateChange.toState);
+        }
       }
     });
 
@@ -294,8 +300,8 @@ class _AnimationBuilder implements AnimationAstVisitor {
 
     statements.push(new o.ReturnStatement(
         o.importExpr(createIdentifier(Identifiers.AnimationTransition)).instantiate([
-          _ANIMATION_PLAYER_VAR, _ANIMATION_CURRENT_STATE_VAR, _ANIMATION_NEXT_STATE_VAR,
-          _ANIMATION_TIME_VAR
+          _ANIMATION_PLAYER_VAR, _ANIMATION_FACTORY_ELEMENT_VAR, o.literal(this.animationName),
+          _ANIMATION_CURRENT_STATE_VAR, _ANIMATION_NEXT_STATE_VAR, _ANIMATION_TIME_VAR
         ])));
 
     return o.fn(

modules/@angular/compiler/src/animation/animation_parser.ts

@@ -6,6 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import {StaticSymbol} from '../aot/static_symbol';
 import {CompileAnimationAnimateMetadata, CompileAnimationEntryMetadata, CompileAnimationGroupMetadata, CompileAnimationKeyframesSequenceMetadata, CompileAnimationMetadata, CompileAnimationSequenceMetadata, CompileAnimationStateDeclarationMetadata, CompileAnimationStateTransitionMetadata, CompileAnimationStyleMetadata, CompileAnimationWithStepsMetadata, CompileDirectiveMetadata, identifierName} from '../compile_metadata';
 import {StringMapWrapper} from '../facade/collection';
 import {isBlank, isPresent} from '../facade/lang';
@@ -14,7 +15,7 @@ import {ParseError} from '../parse_util';
 import {ANY_STATE, FILL_STYLE_FLAG} from '../private_import_core';
 import {ElementSchemaRegistry} from '../schema/element_schema_registry';
 
-import {AnimationAst, AnimationEntryAst, AnimationGroupAst, AnimationKeyframeAst, AnimationSequenceAst, AnimationStateDeclarationAst, AnimationStateTransitionAst, AnimationStateTransitionExpression, AnimationStepAst, AnimationStylesAst, AnimationWithStepsAst} from './animation_ast';
+import {AnimationAst, AnimationEntryAst, AnimationGroupAst, AnimationKeyframeAst, AnimationSequenceAst, AnimationStateDeclarationAst, AnimationStateTransitionAst, AnimationStateTransitionExpression, AnimationStateTransitionFnExpression, AnimationStepAst, AnimationStylesAst, AnimationWithStepsAst} from './animation_ast';
 import {StylesCollection} from './styles_collection';
 
 const _INITIAL_KEYFRAME = 0;
@@ -110,9 +111,12 @@ function _parseAnimationStateTransition(
     errors: AnimationParseError[]): AnimationStateTransitionAst {
   const styles = new StylesCollection();
   const transitionExprs: AnimationStateTransitionExpression[] = [];
-  const transitionStates = transitionStateMetadata.stateChangeExpr.split(/\s*,\s*/);
+  const stateChangeExpr = transitionStateMetadata.stateChangeExpr;
+  const transitionStates: Array<Function|StaticSymbol|string> = typeof stateChangeExpr == 'string' ?
+      (<string>stateChangeExpr).split(/\s*,\s*/) :
+      [<Function|StaticSymbol>stateChangeExpr];
   transitionStates.forEach(
-      expr => { transitionExprs.push(..._parseAnimationTransitionExpr(expr, errors)); });
+      expr => transitionExprs.push(..._parseAnimationTransitionExpr(expr, errors)));
   const entry = _normalizeAnimationEntry(transitionStateMetadata.steps);
   const animation = _normalizeStyleSteps(entry, stateStyles, schema, errors);
   const animationAst = _parseTransitionAnimation(animation, 0, styles, stateStyles, errors);
@@ -141,25 +145,32 @@ function _parseAnimationAlias(alias: string, errors: AnimationParseError[]): str
 }
 
 function _parseAnimationTransitionExpr(
-    eventStr: string, errors: AnimationParseError[]): AnimationStateTransitionExpression[] {
+    transitionValue: string | Function | StaticSymbol,
+    errors: AnimationParseError[]): AnimationStateTransitionExpression[] {
   const expressions: AnimationStateTransitionExpression[] = [];
-  if (eventStr[0] == ':') {
-    eventStr = _parseAnimationAlias(eventStr, errors);
-  }
-  const match = eventStr.match(/^(\*|[-\w]+)\s*(<?[=-]>)\s*(\*|[-\w]+)$/);
-  if (!isPresent(match) || match.length < 4) {
-    errors.push(new AnimationParseError(`the provided ${eventStr} is not of a supported format`));
-    return expressions;
-  }
+  if (typeof transitionValue == 'string') {
+    let eventStr = <string>transitionValue;
+    if (eventStr[0] == ':') {
+      eventStr = _parseAnimationAlias(eventStr, errors);
+    }
+    const match = eventStr.match(/^(\*|[-\w]+)\s*(<?[=-]>)\s*(\*|[-\w]+)$/);
+    if (!isPresent(match) || match.length < 4) {
+      errors.push(new AnimationParseError(`the provided ${eventStr} is not of a supported format`));
+      return expressions;
+    }
 
-  const fromState = match[1];
-  const separator = match[2];
-  const toState = match[3];
-  expressions.push(new AnimationStateTransitionExpression(fromState, toState));
+    const fromState = match[1];
+    const separator = match[2];
+    const toState = match[3];
+    expressions.push(new AnimationStateTransitionExpression(fromState, toState));
 
-  const isFullAnyStateExpr = fromState == ANY_STATE && toState == ANY_STATE;
-  if (separator[0] == '<' && !isFullAnyStateExpr) {
-    expressions.push(new AnimationStateTransitionExpression(toState, fromState));
+    const isFullAnyStateExpr = fromState == ANY_STATE && toState == ANY_STATE;
+    if (separator[0] == '<' && !isFullAnyStateExpr) {
+      expressions.push(new AnimationStateTransitionExpression(toState, fromState));
+    }
+  } else {
+    expressions.push(
+        new AnimationStateTransitionFnExpression(<Function|StaticSymbol>transitionValue));
   }
   return expressions;
 }

modules/@angular/compiler/src/aot/compiler.ts

@@ -6,13 +6,10 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {SchemaMetadata} from '@angular/core';
-
 import {AnimationCompiler} from '../animation/animation_compiler';
 import {AnimationParser} from '../animation/animation_parser';
-import {CompileDirectiveMetadata, CompileIdentifierMetadata, CompileNgModuleMetadata, CompilePipeMetadata, CompileProviderMetadata, CompileTypeSummary, createHostComponentMeta, identifierModuleUrl, identifierName} from '../compile_metadata';
-import {DirectiveNormalizer} from '../directive_normalizer';
-import {DirectiveWrapperCompileResult, DirectiveWrapperCompiler} from '../directive_wrapper_compiler';
+import {CompileDirectiveMetadata, CompileIdentifierMetadata, CompileNgModuleMetadata, CompileProviderMetadata, componentFactoryName, createHostComponentMeta, identifierName} from '../compile_metadata';
+import {DirectiveWrapperCompiler} from '../directive_wrapper_compiler';
 import {ListWrapper} from '../facade/collection';
 import {Identifiers, createIdentifier, createIdentifierToken} from '../identifiers';
 import {CompileMetadataResolver} from '../metadata_resolver';
@@ -22,13 +19,14 @@ import * as o from '../output/output_ast';
 import {CompiledStylesheet, StyleCompiler} from '../style_compiler';
 import {SummaryResolver} from '../summary_resolver';
 import {TemplateParser} from '../template_parser/template_parser';
-import {ComponentFactoryDependency, DirectiveWrapperDependency, ViewClassDependency, ViewCompileResult, ViewCompiler} from '../view_compiler/view_compiler';
+import {ViewCompiler} from '../view_compiler/view_compiler';
 
 import {AotCompilerHost} from './compiler_host';
 import {GeneratedFile} from './generated_file';
 import {StaticSymbol} from './static_symbol';
-import {ResolvedStaticSymbol, StaticSymbolResolver} from './static_symbol_resolver';
-import {serializeSummaries, summaryFileName} from './summary_serializer';
+import {StaticSymbolResolver} from './static_symbol_resolver';
+import {serializeSummaries} from './summary_serializer';
+import {ngfactoryFilePath, splitTypescriptSuffix, summaryFileName} from './util';
 
 export class AotCompiler {
   private _animationCompiler = new AnimationCompiler();
@@ -65,12 +63,13 @@ export class AotCompiler {
       srcFileUrl: string, ngModuleByPipeOrDirective: Map<StaticSymbol, CompileNgModuleMetadata>,
       directives: StaticSymbol[], pipes: StaticSymbol[], ngModules: StaticSymbol[],
       injectables: StaticSymbol[]): GeneratedFile[] {
-    const fileSuffix = _splitTypescriptSuffix(srcFileUrl)[1];
+    const fileSuffix = splitTypescriptSuffix(srcFileUrl)[1];
     const statements: o.Statement[] = [];
     const exportedVars: string[] = [];
     const generatedFiles: GeneratedFile[] = [];
 
-    generatedFiles.push(this._createSummary(srcFileUrl, directives, pipes, ngModules, injectables));
+    generatedFiles.push(this._createSummary(
+        srcFileUrl, directives, pipes, ngModules, injectables, statements, exportedVars));
 
     // compile all ng modules
     exportedVars.push(
@@ -109,7 +108,7 @@ export class AotCompiler {
     });
     if (statements.length > 0) {
       const srcModule = this._codegenSourceModule(
-          srcFileUrl, _ngfactoryModuleUrl(srcFileUrl), statements, exportedVars);
+          srcFileUrl, ngfactoryFilePath(srcFileUrl), statements, exportedVars);
       generatedFiles.unshift(srcModule);
     }
     return generatedFiles;
@@ -117,7 +116,8 @@ export class AotCompiler {
 
   private _createSummary(
       srcFileUrl: string, directives: StaticSymbol[], pipes: StaticSymbol[],
-      ngModules: StaticSymbol[], injectables: StaticSymbol[]): GeneratedFile {
+      ngModules: StaticSymbol[], injectables: StaticSymbol[], targetStatements: o.Statement[],
+      targetExportedVars: string[]): GeneratedFile {
     const symbolSummaries = this._symbolResolver.getSymbolsOf(srcFileUrl)
                                 .map(symbol => this._symbolResolver.resolveSymbol(symbol));
     const typeSummaries = [
@@ -126,8 +126,13 @@ export class AotCompiler {
       ...pipes.map(ref => this._metadataResolver.getPipeSummary(ref)),
       ...injectables.map(ref => this._metadataResolver.getInjectableSummary(ref))
     ];
-    const json = serializeSummaries(
-        this._host, this._summaryResolver, this._symbolResolver, symbolSummaries, typeSummaries);
+    const {json, exportAs} = serializeSummaries(
+        this._summaryResolver, this._symbolResolver, symbolSummaries, typeSummaries);
+    exportAs.forEach((entry) => {
+      targetStatements.push(
+          o.variable(entry.exportAs).set(o.importExpr({reference: entry.symbol})).toDeclStmt());
+      targetExportedVars.push(entry.exportAs);
+    });
     return new GeneratedFile(srcFileUrl, summaryFileName(srcFileUrl), json);
   }
 
@@ -150,12 +155,6 @@ export class AotCompiler {
     }
 
     const appCompileResult = this._ngModuleCompiler.compile(ngModule, providers);
-
-    appCompileResult.dependencies.forEach((dep) => {
-      dep.placeholder.reference = this._symbolResolver.getStaticSymbol(
-          _ngfactoryModuleUrl(identifierModuleUrl(dep.comp)), _componentFactoryName(dep.comp));
-    });
-
     targetStatements.push(...appCompileResult.statements);
     return appCompileResult.ngModuleFactoryVar;
   }
@@ -172,13 +171,12 @@ export class AotCompiler {
   private _compileComponentFactory(
       compMeta: CompileDirectiveMetadata, ngModule: CompileNgModuleMetadata, fileSuffix: string,
       targetStatements: o.Statement[]): string {
+    const hostType = this._metadataResolver.getHostComponentType(compMeta.type.reference);
     const hostMeta = createHostComponentMeta(
-        this._symbolResolver.getStaticSymbol(
-            identifierModuleUrl(compMeta.type), `${identifierName(compMeta.type)}_Host`),
-        compMeta);
+        hostType, compMeta, this._metadataResolver.getHostComponentViewClass(hostType));
     const hostViewFactoryVar = this._compileComponent(
         hostMeta, ngModule, [compMeta.type], null, fileSuffix, targetStatements);
-    const compFactoryVar = _componentFactoryName(compMeta.type);
+    const compFactoryVar = componentFactoryName(compMeta.type.reference);
     targetStatements.push(
         o.variable(compFactoryVar)
             .set(o.importExpr(
@@ -219,7 +217,7 @@ export class AotCompiler {
           ..._resolveStyleStatements(this._symbolResolver, componentStyles, fileSuffix));
     }
     compiledAnimations.forEach(entry => targetStatements.push(...entry.statements));
-    targetStatements.push(..._resolveViewStatements(this._symbolResolver, viewResult));
+    targetStatements.push(...viewResult.statements);
     return viewResult.viewClassVar;
   }
 
@@ -241,27 +239,6 @@ export class AotCompiler {
   }
 }
 
-function _resolveViewStatements(
-    reflector: StaticSymbolResolver, compileResult: ViewCompileResult): o.Statement[] {
-  compileResult.dependencies.forEach((dep) => {
-    if (dep instanceof ViewClassDependency) {
-      const vfd = <ViewClassDependency>dep;
-      vfd.placeholder.reference =
-          reflector.getStaticSymbol(_ngfactoryModuleUrl(identifierModuleUrl(vfd.comp)), dep.name);
-    } else if (dep instanceof ComponentFactoryDependency) {
-      const cfd = <ComponentFactoryDependency>dep;
-      cfd.placeholder.reference = reflector.getStaticSymbol(
-          _ngfactoryModuleUrl(identifierModuleUrl(cfd.comp)), _componentFactoryName(cfd.comp));
-    } else if (dep instanceof DirectiveWrapperDependency) {
-      const dwd = <DirectiveWrapperDependency>dep;
-      dwd.placeholder.reference =
-          reflector.getStaticSymbol(_ngfactoryModuleUrl(identifierModuleUrl(dwd.dir)), dwd.name);
-    }
-  });
-  return compileResult.statements;
-}
-
-
 function _resolveStyleStatements(
     reflector: StaticSymbolResolver, compileResult: CompiledStylesheet,
     fileSuffix: string): o.Statement[] {
@@ -272,15 +249,6 @@ function _resolveStyleStatements(
   return compileResult.statements;
 }
 
-function _ngfactoryModuleUrl(dirUrl: string): string {
-  const urlWithSuffix = _splitTypescriptSuffix(dirUrl);
-  return `${urlWithSuffix[0]}.ngfactory${urlWithSuffix[1]}`;
-}
-
-function _componentFactoryName(comp: CompileIdentifierMetadata): string {
-  return `${identifierName(comp)}NgFactory`;
-}
-
 function _stylesModuleUrl(stylesheetUrl: string, shim: boolean, suffix: string): string {
   return `${stylesheetUrl}${shim ? '.shim' : ''}.ngstyle${suffix}`;
 }
@@ -292,20 +260,6 @@ function _assertComponent(meta: CompileDirectiveMetadata) {
   }
 }
 
-function _splitTypescriptSuffix(path: string): string[] {
-  if (path.endsWith('.d.ts')) {
-    return [path.slice(0, -5), '.ts'];
-  }
-
-  const lastDot = path.lastIndexOf('.');
-
-  if (lastDot !== -1) {
-    return [path.substring(0, lastDot), path.substring(lastDot)];
-  }
-
-  return [path, ''];
-}
-
 export interface NgAnalyzedModules {
   ngModules: CompileNgModuleMetadata[];
   ngModuleByPipeOrDirective: Map<StaticSymbol, CompileNgModuleMetadata>;

modules/@angular/compiler/src/aot/compiler_factory.ts

@@ -34,11 +34,12 @@ import {AotCompilerHost} from './compiler_host';
 import {AotCompilerOptions} from './compiler_options';
 import {StaticAndDynamicReflectionCapabilities} from './static_reflection_capabilities';
 import {StaticReflector} from './static_reflector';
-import {StaticSymbolCache} from './static_symbol';
+import {StaticSymbol, StaticSymbolCache} from './static_symbol';
 import {StaticSymbolResolver} from './static_symbol_resolver';
 import {AotSummaryResolver} from './summary_resolver';
 
 
+
 /**
  * Creates a new AotCompiler based on options and a host.
  */
@@ -69,13 +70,19 @@ export function createAotCompiler(compilerHost: AotCompilerHost, options: AotCom
   const resolver = new CompileMetadataResolver(
       new NgModuleResolver(staticReflector), new DirectiveResolver(staticReflector),
       new PipeResolver(staticReflector), summaryResolver, elementSchemaRegistry, normalizer,
-      staticReflector);
+      symbolCache, staticReflector);
   // TODO(vicb): do not pass options.i18nFormat here
+  const importResolver = {
+    getImportAs: (symbol: StaticSymbol) => symbolResolver.getImportAs(symbol),
+    fileNameToModuleName: (fileName: string, containingFilePath: string) =>
+                              compilerHost.fileNameToModuleName(fileName, containingFilePath)
+  };
   const compiler = new AotCompiler(
       compilerHost, resolver, tmplParser, new StyleCompiler(urlResolver),
       new ViewCompiler(config, elementSchemaRegistry),
       new DirectiveWrapperCompiler(config, expressionParser, elementSchemaRegistry, console),
-      new NgModuleCompiler(), new TypeScriptEmitter(compilerHost), summaryResolver, options.locale,
-      options.i18nFormat, new AnimationParser(elementSchemaRegistry), symbolResolver);
+      new NgModuleCompiler(), new TypeScriptEmitter(importResolver), summaryResolver,
+      options.locale, options.i18nFormat, new AnimationParser(elementSchemaRegistry),
+      symbolResolver);
   return {compiler, reflector: staticReflector};
 }

modules/@angular/compiler/src/aot/compiler_host.ts

@@ -6,19 +6,23 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {ImportResolver} from '../output/path_util';
-
-import {StaticSymbol} from './static_symbol';
 import {StaticSymbolResolverHost} from './static_symbol_resolver';
 import {AotSummaryResolverHost} from './summary_resolver';
-import {AotSummarySerializerHost} from './summary_serializer';
 
 /**
  * The host of the AotCompiler disconnects the implementation from TypeScript / other language
  * services and from underlying file systems.
  */
-export interface AotCompilerHost extends StaticSymbolResolverHost, ImportResolver,
-    AotSummaryResolverHost, AotSummarySerializerHost {
+export interface AotCompilerHost extends StaticSymbolResolverHost, AotSummaryResolverHost {
+  /**
+   * Converts a file path to a module name that can be used as an `import.
+   * I.e. `path/to/importedFile.ts` should be imported by `path/to/containingFile.ts`.
+   *
+   * See ImportResolver.
+   */
+  fileNameToModuleName(importedFilePath: string, containingFilePath: string): string
+      /*|null*/;
+
   /**
    * Loads a resource (e.g. html / css)
    */

modules/@angular/compiler/src/aot/static_reflector.ts

@@ -10,8 +10,8 @@ import {Attribute, Component, ContentChild, ContentChildren, Directive, Host, Ho
 
 import {ReflectorReader} from '../private_import_core';
 
-import {StaticSymbol, StaticSymbolCache} from './static_symbol';
-import {ResolvedStaticSymbol, StaticSymbolResolver} from './static_symbol_resolver';
+import {StaticSymbol} from './static_symbol';
+import {StaticSymbolResolver} from './static_symbol_resolver';
 
 const ANGULAR_IMPORT_LOCATIONS = {
   coreDecorators: '@angular/core/src/metadata',
@@ -83,8 +83,11 @@ export class StaticReflector implements ReflectorReader {
       annotations = [];
       const classMetadata = this.getTypeMetadata(type);
       if (classMetadata['extends']) {
-        const parentAnnotations = this.annotations(this.simplify(type, classMetadata['extends']));
-        annotations.push(...parentAnnotations);
+        const parentType = this.simplify(type, classMetadata['extends']);
+        if (parentType && (parentType instanceof StaticSymbol)) {
+          const parentAnnotations = this.annotations(parentType);
+          annotations.push(...parentAnnotations);
+        }
       }
       if (classMetadata['decorators']) {
         const ownAnnotations: any[] = this.simplify(type, classMetadata['decorators']);
@@ -101,10 +104,13 @@ export class StaticReflector implements ReflectorReader {
       const classMetadata = this.getTypeMetadata(type);
       propMetadata = {};
       if (classMetadata['extends']) {
-        const parentPropMetadata = this.propMetadata(this.simplify(type, classMetadata['extends']));
-        Object.keys(parentPropMetadata).forEach((parentProp) => {
-          propMetadata[parentProp] = parentPropMetadata[parentProp];
-        });
+        const parentType = this.simplify(type, classMetadata['extends']);
+        if (parentType instanceof StaticSymbol) {
+          const parentPropMetadata = this.propMetadata(parentType);
+          Object.keys(parentPropMetadata).forEach((parentProp) => {
+            propMetadata[parentProp] = parentPropMetadata[parentProp];
+          });
+        }
       }
 
       const members = classMetadata['members'] || {};
@@ -156,7 +162,10 @@ export class StaticReflector implements ReflectorReader {
             parameters.push(nestedResult);
           });
         } else if (classMetadata['extends']) {
-          parameters = this.parameters(this.simplify(type, classMetadata['extends']));
+          const parentType = this.simplify(type, classMetadata['extends']);
+          if (parentType instanceof StaticSymbol) {
+            parameters = this.parameters(parentType);
+          }
         }
         if (!parameters) {
           parameters = [];
@@ -176,10 +185,13 @@ export class StaticReflector implements ReflectorReader {
       const classMetadata = this.getTypeMetadata(type);
       methodNames = {};
       if (classMetadata['extends']) {
-        const parentMethodNames = this._methodNames(this.simplify(type, classMetadata['extends']));
-        Object.keys(parentMethodNames).forEach((parentProp) => {
-          methodNames[parentProp] = parentMethodNames[parentProp];
-        });
+        const parentType = this.simplify(type, classMetadata['extends']);
+        if (parentType instanceof StaticSymbol) {
+          const parentMethodNames = this._methodNames(parentType);
+          Object.keys(parentMethodNames).forEach((parentProp) => {
+            methodNames[parentProp] = parentMethodNames[parentProp];
+          });
+        }
       }
 
       const members = classMetadata['members'] || {};
@@ -310,6 +322,7 @@ export class StaticReflector implements ReflectorReader {
             if (value && (depth != 0 || value.__symbolic != 'error')) {
               const parameters: string[] = targetFunction['parameters'];
               const defaults: any[] = targetFunction.defaults;
+              args = args.map(arg => simplifyInContext(context, arg, depth + 1));
               if (defaults && defaults.length > args.length) {
                 args.push(...defaults.slice(args.length).map((value: any) => simplify(value)));
               }
@@ -499,15 +512,15 @@ export class StaticReflector implements ReflectorReader {
                     return context;
                   }
                   const argExpressions: any[] = expression['arguments'] || [];
-                  const args =
-                      argExpressions.map(arg => simplifyInContext(context, arg, depth + 1));
                   let converter = self.conversionMap.get(staticSymbol);
                   if (converter) {
+                    const args =
+                        argExpressions.map(arg => simplifyInContext(context, arg, depth + 1));
                     return converter(context, args);
                   } else {
                     // Determine if the function is one we can simplify.
                     const targetFunction = resolveReferenceValue(staticSymbol);
-                    return simplifyCall(staticSymbol, targetFunction, args);
+                    return simplifyCall(staticSymbol, targetFunction, argExpressions);
                   }
                 }
                 break;
@@ -651,10 +664,6 @@ class PopulatedScope extends BindingScope {
   }
 }
 
-function sameSymbol(a: StaticSymbol, b: StaticSymbol): boolean {
-  return a === b;
-}
-
 function shouldIgnore(value: any): boolean {
   return value && value.__symbolic == 'ignore';
 }

modules/@angular/compiler/src/aot/static_symbol.ts

@@ -12,7 +12,14 @@
  * This token is unique for a filePath and name and can be used as a hash table key.
  */
 export class StaticSymbol {
-  constructor(public filePath: string, public name: string, public members?: string[]) {}
+  constructor(public filePath: string, public name: string, public members: string[]) {}
+
+  assertNoMembers() {
+    if (this.members.length) {
+      throw new Error(
+          `Illegal state: symbol without members expected, but got ${JSON.stringify(this)}.`);
+    }
+  }
 }
 
 /**

modules/@angular/compiler/src/aot/static_symbol_resolver.ts

@@ -45,11 +45,18 @@ const SUPPORTED_SCHEMA_VERSION = 3;
 /**
  * This class is responsible for loading metadata per symbol,
  * and normalizing references between symbols.
+ *
+ * Internally, it only uses symbols without members,
+ * and deduces the values for symbols with members based
+ * on these symbols.
  */
 export class StaticSymbolResolver {
   private metadataCache = new Map<string, {[key: string]: any}>();
+  // Note: this will only contain StaticSymbols without members!
   private resolvedSymbols = new Map<StaticSymbol, ResolvedStaticSymbol>();
   private resolvedFilePaths = new Set<string>();
+  // Note: this will only contain StaticSymbols without members!
+  private importAs = new Map<StaticSymbol, StaticSymbol>();
 
   constructor(
       private host: StaticSymbolResolverHost, private staticSymbolCache: StaticSymbolCache,
@@ -60,13 +67,33 @@ export class StaticSymbolResolver {
     if (staticSymbol.members.length > 0) {
       return this._resolveSymbolMembers(staticSymbol);
     }
-    let result = this._resolveSymbolFromSummary(staticSymbol);
+    let result = this.resolvedSymbols.get(staticSymbol);
+    if (result) {
+      return result;
+    }
+    result = this._resolveSymbolFromSummary(staticSymbol);
+    if (result) {
+      return result;
+    }
+    // Note: Some users use libraries that were not compiled with ngc, i.e. they don't
+    // have summaries, only .d.ts files. So we always need to check both, the summary
+    // and metadata.
+    this._createSymbolsOf(staticSymbol.filePath);
+    result = this.resolvedSymbols.get(staticSymbol);
+    return result;
+  }
+
+  getImportAs(staticSymbol: StaticSymbol): StaticSymbol {
+    if (staticSymbol.members.length) {
+      const baseSymbol = this.getStaticSymbol(staticSymbol.filePath, staticSymbol.name);
+      const baseImportAs = this.getImportAs(baseSymbol);
+      return baseImportAs ?
+          this.getStaticSymbol(baseImportAs.filePath, baseImportAs.name, staticSymbol.members) :
+          null;
+    }
+    let result = this.summaryResolver.getImportAs(staticSymbol);
     if (!result) {
-      // Note: Some users use libraries that were not compiled with ngc, i.e. they don't
-      // have summaries, only .d.ts files. So we always need to check both, the summary
-      // and metadata.
-      this._createSymbolsOf(staticSymbol.filePath);
-      result = this.resolvedSymbols.get(staticSymbol);
+      result = this.importAs.get(staticSymbol);
     }
     return result;
   }
@@ -135,10 +162,13 @@ export class StaticSymbolResolver {
     const metadata = this.getModuleMetadata(filePath);
     if (metadata['metadata']) {
       // handle direct declarations of the symbol
-      Object.keys(metadata['metadata']).forEach((symbolName) => {
-        const symbolMeta = metadata['metadata'][symbolName];
-        resolvedSymbols.push(
-            this.createResolvedSymbol(this.getStaticSymbol(filePath, symbolName), symbolMeta));
+      const topLevelSymbolNames =
+          new Set<string>(Object.keys(metadata['metadata']).map(unescapeIdentifier));
+      Object.keys(metadata['metadata']).forEach((metadataKey) => {
+        const symbolMeta = metadata['metadata'][metadataKey];
+        resolvedSymbols.push(this.createResolvedSymbol(
+            this.getStaticSymbol(filePath, unescapeIdentifier(metadataKey)), topLevelSymbolNames,
+            symbolMeta));
       });
     }
 
@@ -154,15 +184,16 @@ export class StaticSymbolResolver {
             } else {
               symbolName = exportSymbol.as;
             }
+            symbolName = unescapeIdentifier(symbolName);
             let symName = symbolName;
             if (typeof exportSymbol !== 'string') {
-              symName = exportSymbol.name;
+              symName = unescapeIdentifier(exportSymbol.name);
             }
             const resolvedModule = this.resolveModule(moduleExport.from, filePath);
             if (resolvedModule) {
               const targetSymbol = this.getStaticSymbol(resolvedModule, symName);
               const sourceSymbol = this.getStaticSymbol(filePath, symbolName);
-              resolvedSymbols.push(new ResolvedStaticSymbol(sourceSymbol, targetSymbol));
+              resolvedSymbols.push(this.createExport(sourceSymbol, targetSymbol));
             }
           });
         } else {
@@ -172,7 +203,7 @@ export class StaticSymbolResolver {
             const nestedExports = this.getSymbolsOf(resolvedModule);
             nestedExports.forEach((targetSymbol) => {
               const sourceSymbol = this.getStaticSymbol(filePath, targetSymbol.name);
-              resolvedSymbols.push(new ResolvedStaticSymbol(sourceSymbol, targetSymbol));
+              resolvedSymbols.push(this.createExport(sourceSymbol, targetSymbol));
             });
           }
         }
@@ -182,7 +213,9 @@ export class StaticSymbolResolver {
         (resolvedSymbol) => this.resolvedSymbols.set(resolvedSymbol.symbol, resolvedSymbol));
   }
 
-  private createResolvedSymbol(sourceSymbol: StaticSymbol, metadata: any): ResolvedStaticSymbol {
+  private createResolvedSymbol(
+      sourceSymbol: StaticSymbol, topLevelSymbolNames: Set<string>,
+      metadata: any): ResolvedStaticSymbol {
     const self = this;
 
     class ReferenceTransformer extends ValueTransformer {
@@ -196,7 +229,7 @@ export class StaticSymbolResolver {
           return result;
         } else if (symbolic === 'reference') {
           const module = map['module'];
-          const name = map['name'];
+          const name = map['name'] ? unescapeIdentifier(map['name']) : map['name'];
           if (!name) {
             return null;
           }
@@ -209,28 +242,43 @@ export class StaticSymbolResolver {
                 message: `Could not resolve ${module} relative to ${sourceSymbol.filePath}.`
               };
             }
-          } else {
-            const isFunctionParam = functionParams.indexOf(name) >= 0;
-            if (!isFunctionParam) {
-              filePath = sourceSymbol.filePath;
-            }
-          }
-          if (filePath) {
             return self.getStaticSymbol(filePath, name);
-          } else {
+          } else if (functionParams.indexOf(name) >= 0) {
             // reference to a function parameter
             return {__symbolic: 'reference', name: name};
+          } else {
+            if (topLevelSymbolNames.has(name)) {
+              return self.getStaticSymbol(sourceSymbol.filePath, name);
+            }
+            // ambient value
+            null;
           }
         } else {
           return super.visitStringMap(map, functionParams);
         }
       }
     }
-
     const transformedMeta = visitValue(metadata, new ReferenceTransformer(), []);
+    if (transformedMeta instanceof StaticSymbol) {
+      return this.createExport(sourceSymbol, transformedMeta);
+    }
     return new ResolvedStaticSymbol(sourceSymbol, transformedMeta);
   }
 
+  private createExport(sourceSymbol: StaticSymbol, targetSymbol: StaticSymbol):
+      ResolvedStaticSymbol {
+    sourceSymbol.assertNoMembers();
+    targetSymbol.assertNoMembers();
+    if (this.summaryResolver.isLibraryFile(sourceSymbol.filePath)) {
+      // This case is for an ng library importing symbols from a plain ts library
+      // transitively.
+      // Note: We rely on the fact that we discover symbols in the direction
+      // from source files to library files
+      this.importAs.set(targetSymbol, this.getImportAs(sourceSymbol) || sourceSymbol);
+    }
+    return new ResolvedStaticSymbol(sourceSymbol, targetSymbol);
+  }
+
   private reportError(error: Error, context: StaticSymbol, path?: string) {
     if (this.errorRecorder) {
       this.errorRecorder(error, (context && context.filePath) || path);
@@ -287,3 +335,9 @@ export class StaticSymbolResolver {
     }
   }
 }
+
+// Remove extra underscore from escaped identifier.
+// See https://github.com/Microsoft/TypeScript/blob/master/src/compiler/utilities.ts
+export function unescapeIdentifier(identifier: string): string {
+  return identifier.startsWith('___') ? identifier.substr(1) : identifier;
+}

modules/@angular/compiler/src/aot/summary_resolver.ts

@@ -5,14 +5,12 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
-import {CompileSummaryKind, CompileTypeSummary} from '../compile_metadata';
+
 import {Summary, SummaryResolver} from '../summary_resolver';
 
 import {StaticSymbol, StaticSymbolCache} from './static_symbol';
-import {ResolvedStaticSymbol} from './static_symbol_resolver';
-import {deserializeSummaries, summaryFileName} from './summary_serializer';
-
-const STRIP_SRC_FILE_SUFFIXES = /(\.ts|\.d\.ts|\.js|\.jsx|\.tsx)$/;
+import {deserializeSummaries} from './summary_serializer';
+import {ngfactoryFilePath, stripNgFactory, summaryFileName} from './util';
 
 export interface AotSummaryResolverHost {
   /**
@@ -24,23 +22,34 @@ export interface AotSummaryResolverHost {
    * Returns whether a file is a source file or not.
    */
   isSourceFile(sourceFilePath: string): boolean;
+  /**
+   * Returns the output file path of a source file.
+   * E.g.
+   * `some_file.ts` -> `some_file.d.ts`
+   */
+  getOutputFileName(sourceFilePath: string): string;
 }
 
 export class AotSummaryResolver implements SummaryResolver<StaticSymbol> {
+  // Note: this will only contain StaticSymbols without members!
   private summaryCache = new Map<StaticSymbol, Summary<StaticSymbol>>();
   private loadedFilePaths = new Set<string>();
+  // Note: this will only contain StaticSymbols without members!
+  private importAs = new Map<StaticSymbol, StaticSymbol>();
 
   constructor(private host: AotSummaryResolverHost, private staticSymbolCache: StaticSymbolCache) {}
 
-  private _assertNoMembers(symbol: StaticSymbol) {
-    if (symbol.members.length) {
-      throw new Error(
-          `Internal state: StaticSymbols in summaries can't have members! ${JSON.stringify(symbol)}`);
-    }
+  isLibraryFile(filePath: string): boolean {
+    // Note: We need to strip the .ngfactory. file path,
+    // so this method also works for generated files
+    // (for which host.isSourceFile will always return false).
+    return !this.host.isSourceFile(stripNgFactory(filePath));
   }
 
+  getLibraryFileName(filePath: string) { return this.host.getOutputFileName(filePath); }
+
   resolveSummary(staticSymbol: StaticSymbol): Summary<StaticSymbol> {
-    this._assertNoMembers(staticSymbol);
+    staticSymbol.assertNoMembers();
     let summary = this.summaryCache.get(staticSymbol);
     if (!summary) {
       this._loadSummaryFile(staticSymbol.filePath);
@@ -54,12 +63,17 @@ export class AotSummaryResolver implements SummaryResolver<StaticSymbol> {
     return Array.from(this.summaryCache.keys()).filter((symbol) => symbol.filePath === filePath);
   }
 
+  getImportAs(staticSymbol: StaticSymbol): StaticSymbol {
+    staticSymbol.assertNoMembers();
+    return this.importAs.get(staticSymbol);
+  }
+
   private _loadSummaryFile(filePath: string) {
     if (this.loadedFilePaths.has(filePath)) {
       return;
     }
     this.loadedFilePaths.add(filePath);
-    if (!this.host.isSourceFile(filePath)) {
+    if (this.isLibraryFile(filePath)) {
       const summaryFilePath = summaryFileName(filePath);
       let json: string;
       try {
@@ -69,8 +83,13 @@ export class AotSummaryResolver implements SummaryResolver<StaticSymbol> {
         throw e;
       }
       if (json) {
-        const readSummaries = deserializeSummaries(this.staticSymbolCache, json);
-        readSummaries.forEach((summary) => { this.summaryCache.set(summary.symbol, summary); });
+        const {summaries, importAs} = deserializeSummaries(this.staticSymbolCache, json);
+        summaries.forEach((summary) => this.summaryCache.set(summary.symbol, summary));
+        importAs.forEach((importAs) => {
+          this.importAs.set(
+              importAs.symbol,
+              this.staticSymbolCache.get(ngfactoryFilePath(filePath), importAs.importAs));
+        });
       }
     }
   }

modules/@angular/compiler/src/aot/summary_serializer.ts

@@ -5,35 +5,19 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
-import {CompileDirectiveSummary, CompileIdentifierMetadata, CompileNgModuleSummary, CompilePipeSummary, CompileSummaryKind, CompileTypeMetadata, CompileTypeSummary, identifierModuleUrl, identifierName} from '../compile_metadata';
+import {CompileNgModuleSummary, CompileSummaryKind, CompileTypeSummary} from '../compile_metadata';
 import {Summary, SummaryResolver} from '../summary_resolver';
 import {ValueTransformer, visitValue} from '../util';
 
-import {GeneratedFile} from './generated_file';
 import {StaticSymbol, StaticSymbolCache} from './static_symbol';
 import {ResolvedStaticSymbol, StaticSymbolResolver} from './static_symbol_resolver';
 
-const STRIP_SRC_FILE_SUFFIXES = /(\.ts|\.d\.ts|\.js|\.jsx|\.tsx)$/;
-
-export interface AotSummarySerializerHost {
-  /**
-   * Returns the output file path of a source file.
-   * E.g.
-   * `some_file.ts` -> `some_file.d.ts`
-   */
-  getOutputFileName(sourceFilePath: string): string;
-  /**
-   * Returns whether a file is a source file or not.
-   */
-  isSourceFile(sourceFilePath: string): boolean;
-}
 
 export function serializeSummaries(
-    host: AotSummarySerializerHost, summaryResolver: SummaryResolver<StaticSymbol>,
-    symbolResolver: StaticSymbolResolver,
-
-    symbols: ResolvedStaticSymbol[], types: CompileTypeSummary[]): string {
-  const serializer = new Serializer(host);
+    summaryResolver: SummaryResolver<StaticSymbol>, symbolResolver: StaticSymbolResolver,
+    symbols: ResolvedStaticSymbol[], types: CompileTypeSummary[]):
+    {json: string, exportAs: {symbol: StaticSymbol, exportAs: string}[]} {
+  const serializer = new Serializer(symbolResolver, summaryResolver);
 
   // for symbols, we use everything except for the class metadata itself
   // (we keep the statics though), as the class metadata is contained in the
@@ -46,7 +30,7 @@ export function serializeSummaries(
   // we execute the loop!
   for (let processedIndex = 0; processedIndex < serializer.symbols.length; processedIndex++) {
     const symbol = serializer.symbols[processedIndex];
-    if (!host.isSourceFile(symbol.filePath)) {
+    if (summaryResolver.isLibraryFile(symbol.filePath)) {
       let summary = summaryResolver.resolveSummary(symbol);
       if (!summary) {
         // some symbols might originate from a plain typescript library
@@ -74,8 +58,11 @@ export function serializeSummaries(
       const ngModuleSummary = <CompileNgModuleSummary>typeSummary;
       ngModuleSummary.exportedDirectives.concat(ngModuleSummary.exportedPipes).forEach((id) => {
         const symbol: StaticSymbol = id.reference;
-        if (!host.isSourceFile(symbol.filePath)) {
-          serializer.addOrMergeSummary(summaryResolver.resolveSummary(symbol));
+        if (summaryResolver.isLibraryFile(symbol.filePath)) {
+          const summary = summaryResolver.resolveSummary(symbol);
+          if (summary) {
+            serializer.addOrMergeSummary(summary);
+          }
         }
       });
     }
@@ -83,18 +70,14 @@ export function serializeSummaries(
   return serializer.serialize();
 }
 
-export function deserializeSummaries(
-    symbolCache: StaticSymbolCache, json: string): Summary<StaticSymbol>[] {
+export function deserializeSummaries(symbolCache: StaticSymbolCache, json: string):
+    {summaries: Summary<StaticSymbol>[], importAs: {symbol: StaticSymbol, importAs: string}[]} {
   const deserializer = new Deserializer(symbolCache);
   return deserializer.deserialize(json);
 }
 
-export function summaryFileName(fileName: string): string {
-  const fileNameWithoutSuffix = fileName.replace(STRIP_SRC_FILE_SUFFIXES, '');
-  return `${fileNameWithoutSuffix}.ngsummary.json`;
-}
-
 class Serializer extends ValueTransformer {
+  // Note: This only contains symbols without members.
   symbols: StaticSymbol[] = [];
   private indexBySymbol = new Map<StaticSymbol, number>();
   // This now contains a `__symbol: number` in the place of
@@ -102,7 +85,11 @@ class Serializer extends ValueTransformer {
   private processedSummaryBySymbol = new Map<StaticSymbol, any>();
   private processedSummaries: any[] = [];
 
-  constructor(private host: AotSummarySerializerHost) { super(); }
+  constructor(
+      private symbolResolver: StaticSymbolResolver,
+      private summaryResolver: SummaryResolver<StaticSymbol>) {
+    super();
+  }
 
   addOrMergeSummary(summary: Summary<StaticSymbol>) {
     let symbolMeta = summary.metadata;
@@ -129,34 +116,44 @@ class Serializer extends ValueTransformer {
     }
   }
 
-  serialize(): string {
-    return JSON.stringify({
+  serialize(): {json: string, exportAs: {symbol: StaticSymbol, exportAs: string}[]} {
+    const exportAs: {symbol: StaticSymbol, exportAs: string}[] = [];
+    const json = JSON.stringify({
       summaries: this.processedSummaries,
       symbols: this.symbols.map((symbol, index) => {
+        symbol.assertNoMembers();
+        let importAs: string;
+        if (this.summaryResolver.isLibraryFile(symbol.filePath)) {
+          importAs = `${symbol.name}_${index}`;
+          exportAs.push({symbol, exportAs: importAs});
+        }
         return {
           __symbol: index,
           name: symbol.name,
           // We convert the source filenames tinto output filenames,
           // as the generated summary file will be used when teh current
           // compilation unit is used as a library
-          filePath: this.host.getOutputFileName(symbol.filePath)
+          filePath: this.summaryResolver.getLibraryFileName(symbol.filePath),
+          importAs: importAs
         };
       })
     });
+    return {json, exportAs};
   }
 
   private processValue(value: any): any { return visitValue(value, this, null); }
 
   visitOther(value: any, context: any): any {
     if (value instanceof StaticSymbol) {
-      let index = this.indexBySymbol.get(value);
+      const baseSymbol = this.symbolResolver.getStaticSymbol(value.filePath, value.name);
+      let index = this.indexBySymbol.get(baseSymbol);
       // Note: == by purpose to compare with undefined!
       if (index == null) {
         index = this.indexBySymbol.size;
-        this.indexBySymbol.set(value, index);
-        this.symbols.push(value);
+        this.indexBySymbol.set(baseSymbol, index);
+        this.symbols.push(baseSymbol);
       }
-      return {__symbol: index};
+      return {__symbol: index, members: value.members};
     }
   }
 }
@@ -166,16 +163,28 @@ class Deserializer extends ValueTransformer {
 
   constructor(private symbolCache: StaticSymbolCache) { super(); }
 
-  deserialize(json: string): Summary<StaticSymbol>[] {
+  deserialize(json: string):
+      {summaries: Summary<StaticSymbol>[], importAs: {symbol: StaticSymbol, importAs: string}[]} {
     const data: {summaries: any[], symbols: any[]} = JSON.parse(json);
-    this.symbols = data.symbols.map(
-        serializedSymbol => this.symbolCache.get(serializedSymbol.filePath, serializedSymbol.name));
-    return visitValue(data.summaries, this, null);
+    const importAs: {symbol: StaticSymbol, importAs: string}[] = [];
+    this.symbols = [];
+    data.symbols.forEach((serializedSymbol) => {
+      const symbol = this.symbolCache.get(serializedSymbol.filePath, serializedSymbol.name);
+      this.symbols.push(symbol);
+      if (serializedSymbol.importAs) {
+        importAs.push({symbol: symbol, importAs: serializedSymbol.importAs});
+      }
+    });
+    const summaries = visitValue(data.summaries, this, null);
+    return {summaries, importAs};
   }
 
   visitStringMap(map: {[key: string]: any}, context: any): any {
     if ('__symbol' in map) {
-      return this.symbols[map['__symbol']];
+      const baseSymbol = this.symbols[map['__symbol']];
+      const members = map['members'];
+      return members.length ? this.symbolCache.get(baseSymbol.filePath, baseSymbol.name, members) :
+                              baseSymbol;
     } else {
       return super.visitStringMap(map, context);
     }

modules/@angular/compiler/src/aot/util.ts

@@ -0,0 +1,37 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+const STRIP_SRC_FILE_SUFFIXES = /(\.ts|\.d\.ts|\.js|\.jsx|\.tsx)$/;
+
+export function ngfactoryFilePath(filePath: string): string {
+  const urlWithSuffix = splitTypescriptSuffix(filePath);
+  return `${urlWithSuffix[0]}.ngfactory${urlWithSuffix[1]}`;
+}
+
+export function stripNgFactory(filePath: string): string {
+  return filePath.replace(/\.ngfactory\./, '.');
+}
+
+export function splitTypescriptSuffix(path: string): string[] {
+  if (path.endsWith('.d.ts')) {
+    return [path.slice(0, -5), '.ts'];
+  }
+
+  const lastDot = path.lastIndexOf('.');
+
+  if (lastDot !== -1) {
+    return [path.substring(0, lastDot), path.substring(lastDot)];
+  }
+
+  return [path, ''];
+}
+
+export function summaryFileName(fileName: string): string {
+  const fileNameWithoutSuffix = fileName.replace(STRIP_SRC_FILE_SUFFIXES, '');
+  return `${fileNameWithoutSuffix}.ngsummary.json`;
+}

modules/@angular/compiler/src/compile_metadata.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {ChangeDetectionStrategy, SchemaMetadata, Type, ViewEncapsulation} from '@angular/core';
+import {ChangeDetectionStrategy, ComponentFactory, SchemaMetadata, Type, ViewEncapsulation} from '@angular/core';
 
 import {StaticSymbol} from './aot/static_symbol';
 import {ListWrapper} from './facade/collection';
@@ -39,7 +39,11 @@ export class CompileAnimationStateDeclarationMetadata extends CompileAnimationSt
 }
 
 export class CompileAnimationStateTransitionMetadata extends CompileAnimationStateMetadata {
-  constructor(public stateChangeExpr: string, public steps: CompileAnimationMetadata) { super(); }
+  constructor(
+      public stateChangeExpr: string|StaticSymbol|((stateA: string, stateB: string) => boolean),
+      public steps: CompileAnimationMetadata) {
+    super();
+  }
 }
 
 export abstract class CompileAnimationMetadata {}
@@ -112,6 +116,24 @@ export function identifierModuleUrl(compileIdentifier: CompileIdentifierMetadata
   return reflector.importUri(ref);
 }
 
+export function viewClassName(compType: any, embeddedTemplateIndex: number): string {
+  return `View_${identifierName({reference: compType})}_${embeddedTemplateIndex}`;
+}
+
+export function hostViewClassName(compType: any): string {
+  return `HostView_${identifierName({reference: compType})}`;
+}
+
+export function dirWrapperClassName(dirType: any) {
+  return `Wrapper_${identifierName({reference: dirType})}`;
+}
+
+export function componentFactoryName(compType: any): string {
+  return `${identifierName({reference: compType})}NgFactory`;
+}
+
+export interface ProxyClass { setDelegate(delegate: any): void; }
+
 export interface CompileIdentifierMetadata { reference: any; }
 
 export enum CompileSummaryKind {
@@ -241,7 +263,7 @@ export class CompileTemplateMetadata {
         externalStylesheets?: CompileStylesheetMetadata[],
         ngContentSelectors?: string[],
         animations?: CompileAnimationEntryMetadata[],
-        interpolation?: [string, string]
+        interpolation?: [string, string],
       } = {}) {
     this.encapsulation = encapsulation;
     this.template = template;
@@ -261,11 +283,16 @@ export class CompileTemplateMetadata {
     return {
       animations: this.animations.map(anim => anim.name),
       ngContentSelectors: this.ngContentSelectors,
-      encapsulation: this.encapsulation
+      encapsulation: this.encapsulation,
     };
   }
 }
 
+export interface CompileEntryComponentMetadata {
+  componentType: any;
+  componentFactory: StaticSymbol|ComponentFactory<any>;
+}
+
 // Note: This should only use interfaces as nested data types
 // as we need to be able to serialize this from/to JSON!
 export interface CompileDirectiveSummary extends CompileTypeSummary {
@@ -281,9 +308,12 @@ export interface CompileDirectiveSummary extends CompileTypeSummary {
   providers: CompileProviderMetadata[];
   viewProviders: CompileProviderMetadata[];
   queries: CompileQueryMetadata[];
-  entryComponents: CompileIdentifierMetadata[];
+  entryComponents: CompileEntryComponentMetadata[];
   changeDetection: ChangeDetectionStrategy;
   template: CompileTemplateSummary;
+  wrapperType: StaticSymbol|ProxyClass;
+  componentViewType: StaticSymbol|ProxyClass;
+  componentFactory: StaticSymbol|ComponentFactory<any>;
 }
 
 /**
@@ -292,7 +322,8 @@ export interface CompileDirectiveSummary extends CompileTypeSummary {
 export class CompileDirectiveMetadata {
   static create(
       {isHost, type, isComponent, selector, exportAs, changeDetection, inputs, outputs, host,
-       providers, viewProviders, queries, viewQueries, entryComponents, template}: {
+       providers, viewProviders, queries, viewQueries, entryComponents, template, wrapperType,
+       componentViewType, componentFactory}: {
         isHost?: boolean,
         type?: CompileTypeMetadata,
         isComponent?: boolean,
@@ -306,8 +337,11 @@ export class CompileDirectiveMetadata {
         viewProviders?: CompileProviderMetadata[],
         queries?: CompileQueryMetadata[],
         viewQueries?: CompileQueryMetadata[],
-        entryComponents?: CompileIdentifierMetadata[],
-        template?: CompileTemplateMetadata
+        entryComponents?: CompileEntryComponentMetadata[],
+        template?: CompileTemplateMetadata,
+        wrapperType?: StaticSymbol|ProxyClass,
+        componentViewType?: StaticSymbol|ProxyClass,
+        componentFactory?: StaticSymbol|ComponentFactory<any>,
       } = {}): CompileDirectiveMetadata {
     const hostListeners: {[key: string]: string} = {};
     const hostProperties: {[key: string]: string} = {};
@@ -359,6 +393,9 @@ export class CompileDirectiveMetadata {
       viewQueries,
       entryComponents,
       template,
+      wrapperType,
+      componentViewType,
+      componentFactory,
     });
   }
   isHost: boolean;
@@ -376,32 +413,39 @@ export class CompileDirectiveMetadata {
   viewProviders: CompileProviderMetadata[];
   queries: CompileQueryMetadata[];
   viewQueries: CompileQueryMetadata[];
-  entryComponents: CompileIdentifierMetadata[];
+  entryComponents: CompileEntryComponentMetadata[];
 
   template: CompileTemplateMetadata;
 
-  constructor(
-      {isHost, type, isComponent, selector, exportAs, changeDetection, inputs, outputs,
-       hostListeners, hostProperties, hostAttributes, providers, viewProviders, queries,
-       viewQueries, entryComponents, template}: {
-        isHost?: boolean,
-        type?: CompileTypeMetadata,
-        isComponent?: boolean,
-        selector?: string,
-        exportAs?: string,
-        changeDetection?: ChangeDetectionStrategy,
-        inputs?: {[key: string]: string},
-        outputs?: {[key: string]: string},
-        hostListeners?: {[key: string]: string},
-        hostProperties?: {[key: string]: string},
-        hostAttributes?: {[key: string]: string},
-        providers?: CompileProviderMetadata[],
-        viewProviders?: CompileProviderMetadata[],
-        queries?: CompileQueryMetadata[],
-        viewQueries?: CompileQueryMetadata[],
-        entryComponents?: CompileIdentifierMetadata[],
-        template?: CompileTemplateMetadata,
-      } = {}) {
+  wrapperType: StaticSymbol|ProxyClass;
+  componentViewType: StaticSymbol|ProxyClass;
+  componentFactory: StaticSymbol|ComponentFactory<any>;
+
+  constructor({isHost,          type,      isComponent,   selector,          exportAs,
+               changeDetection, inputs,    outputs,       hostListeners,     hostProperties,
+               hostAttributes,  providers, viewProviders, queries,           viewQueries,
+               entryComponents, template,  wrapperType,   componentViewType, componentFactory}: {
+    isHost?: boolean,
+    type?: CompileTypeMetadata,
+    isComponent?: boolean,
+    selector?: string,
+    exportAs?: string,
+    changeDetection?: ChangeDetectionStrategy,
+    inputs?: {[key: string]: string},
+    outputs?: {[key: string]: string},
+    hostListeners?: {[key: string]: string},
+    hostProperties?: {[key: string]: string},
+    hostAttributes?: {[key: string]: string},
+    providers?: CompileProviderMetadata[],
+    viewProviders?: CompileProviderMetadata[],
+    queries?: CompileQueryMetadata[],
+    viewQueries?: CompileQueryMetadata[],
+    entryComponents?: CompileEntryComponentMetadata[],
+    template?: CompileTemplateMetadata,
+    wrapperType?: StaticSymbol|ProxyClass,
+    componentViewType?: StaticSymbol|ProxyClass,
+    componentFactory?: StaticSymbol|ComponentFactory<any>,
+  } = {}) {
     this.isHost = !!isHost;
     this.type = type;
     this.isComponent = isComponent;
@@ -418,8 +462,11 @@ export class CompileDirectiveMetadata {
     this.queries = _normalizeArray(queries);
     this.viewQueries = _normalizeArray(viewQueries);
     this.entryComponents = _normalizeArray(entryComponents);
-
     this.template = template;
+
+    this.wrapperType = wrapperType;
+    this.componentViewType = componentViewType;
+    this.componentFactory = componentFactory;
   }
 
   toSummary(): CompileDirectiveSummary {
@@ -439,7 +486,10 @@ export class CompileDirectiveMetadata {
       queries: this.queries,
       entryComponents: this.entryComponents,
       changeDetection: this.changeDetection,
-      template: this.template && this.template.toSummary()
+      template: this.template && this.template.toSummary(),
+      wrapperType: this.wrapperType,
+      componentViewType: this.componentViewType,
+      componentFactory: this.componentFactory
     };
   }
 }
@@ -448,11 +498,12 @@ export class CompileDirectiveMetadata {
  * Construct {@link CompileDirectiveMetadata} from {@link ComponentTypeMetadata} and a selector.
  */
 export function createHostComponentMeta(
-    typeReference: any, compMeta: CompileDirectiveMetadata): CompileDirectiveMetadata {
+    hostTypeReference: any, compMeta: CompileDirectiveMetadata,
+    hostViewType: StaticSymbol | ProxyClass): CompileDirectiveMetadata {
   const template = CssSelector.parse(compMeta.selector)[0].getMatchingElementTemplate();
   return CompileDirectiveMetadata.create({
     isHost: true,
-    type: {reference: typeReference, diDeps: [], lifecycleHooks: []},
+    type: {reference: hostTypeReference, diDeps: [], lifecycleHooks: []},
     template: new CompileTemplateMetadata({
       encapsulation: ViewEncapsulation.None,
       template: template,
@@ -471,7 +522,8 @@ export function createHostComponentMeta(
     providers: [],
     viewProviders: [],
     queries: [],
-    viewQueries: []
+    viewQueries: [],
+    componentViewType: hostViewType
   });
 }
 
@@ -517,7 +569,7 @@ export interface CompileNgModuleSummary extends CompileTypeSummary {
   exportedPipes: CompileIdentifierMetadata[];
 
   // Note: This is transitive.
-  entryComponents: CompileIdentifierMetadata[];
+  entryComponents: CompileEntryComponentMetadata[];
   // Note: This is transitive.
   providers: {provider: CompileProviderMetadata, module: CompileIdentifierMetadata}[];
   // Note: This is transitive.
@@ -534,7 +586,7 @@ export class CompileNgModuleMetadata {
   declaredPipes: CompileIdentifierMetadata[];
 
   exportedPipes: CompileIdentifierMetadata[];
-  entryComponents: CompileIdentifierMetadata[];
+  entryComponents: CompileEntryComponentMetadata[];
   bootstrapComponents: CompileIdentifierMetadata[];
   providers: CompileProviderMetadata[];
 
@@ -555,7 +607,7 @@ export class CompileNgModuleMetadata {
         exportedDirectives?: CompileIdentifierMetadata[],
         declaredPipes?: CompileIdentifierMetadata[],
         exportedPipes?: CompileIdentifierMetadata[],
-        entryComponents?: CompileIdentifierMetadata[],
+        entryComponents?: CompileEntryComponentMetadata[],
         bootstrapComponents?: CompileIdentifierMetadata[],
         importedModules?: CompileNgModuleSummary[],
         exportedModules?: CompileNgModuleSummary[],
@@ -603,7 +655,7 @@ export class TransitiveCompileNgModuleMetadata {
   modulesSet = new Set<any>();
   modules: CompileTypeMetadata[] = [];
   entryComponentsSet = new Set<any>();
-  entryComponents: CompileIdentifierMetadata[] = [];
+  entryComponents: CompileEntryComponentMetadata[] = [];
 
   providers: {provider: CompileProviderMetadata, module: CompileIdentifierMetadata}[] = [];
 
@@ -641,10 +693,10 @@ export class TransitiveCompileNgModuleMetadata {
       this.modules.push(id);
     }
   }
-  addEntryComponent(id: CompileIdentifierMetadata) {
-    if (!this.entryComponentsSet.has(id.reference)) {
-      this.entryComponentsSet.add(id.reference);
-      this.entryComponents.push(id);
+  addEntryComponent(ec: CompileEntryComponentMetadata) {
+    if (!this.entryComponentsSet.has(ec.componentType)) {
+      this.entryComponentsSet.add(ec.componentType);
+      this.entryComponents.push(ec);
     }
   }
 }

modules/@angular/compiler/src/compiler_util/binding_util.ts

@@ -6,12 +6,9 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Identifiers, createIdentifier} from '../identifiers';
 import {ClassBuilder} from '../output/class_builder';
 import * as o from '../output/output_ast';
 
-import {ConvertPropertyBindingResult} from './expression_converter';
-
 export class CheckBindingField {
   constructor(public expression: o.ReadPropExpr, public bindingId: string) {}
 }
@@ -21,28 +18,14 @@ export function createCheckBindingField(builder: ClassBuilder): CheckBindingFiel
   const fieldExpr = createBindFieldExpr(bindingId);
   // private is fine here as no child view will reference the cached value...
   builder.fields.push(new o.ClassField(fieldExpr.name, null, [o.StmtModifier.Private]));
-  builder.ctorStmts.push(o.THIS_EXPR.prop(fieldExpr.name)
-                             .set(o.importExpr(createIdentifier(Identifiers.UNINITIALIZED)))
-                             .toStmt());
+  builder.ctorStmts.push(o.THIS_EXPR.prop(fieldExpr.name).set(o.literal(undefined)).toStmt());
   return new CheckBindingField(fieldExpr, bindingId);
 }
 
-export function createCheckBindingStmt(
-    evalResult: ConvertPropertyBindingResult, fieldExpr: o.ReadPropExpr,
-    throwOnChangeVar: o.Expression, actions: o.Statement[]): o.Statement[] {
-  let condition: o.Expression = o.importExpr(createIdentifier(Identifiers.checkBinding)).callFn([
-    throwOnChangeVar, fieldExpr, evalResult.currValExpr
-  ]);
-  if (evalResult.forceUpdate) {
-    condition = evalResult.forceUpdate.or(condition);
-  }
-  return [
-    ...evalResult.stmts, new o.IfStmt(condition, actions.concat([
-      <o.Statement>o.THIS_EXPR.prop(fieldExpr.name).set(evalResult.currValExpr).toStmt()
-    ]))
-  ];
-}
-
 function createBindFieldExpr(bindingId: string): o.ReadPropExpr {
   return o.THIS_EXPR.prop(`_expr_${bindingId}`);
 }
+
+export function isFirstViewCheck(view: o.Expression): o.Expression {
+  return o.not(view.prop('numberOfChecks'));
+}

modules/@angular/compiler/src/compiler_util/expression_converter.ts

@@ -8,7 +8,7 @@
 
 
 import * as cdAst from '../expression_parser/ast';
-import {isBlank, isPresent} from '../facade/lang';
+import {isBlank} from '../facade/lang';
 import {Identifiers, createIdentifier} from '../identifiers';
 import {ClassBuilder} from '../output/class_builder';
 import * as o from '../output/output_ast';
@@ -338,7 +338,7 @@ class _AstToIrVisitor implements cdAst.AstVisitor {
       const receiver = this.visit(ast.receiver, _Mode.Expression);
       if (receiver === this._implicitReceiver) {
         const varExpr = this._getLocal(ast.name);
-        if (isPresent(varExpr)) {
+        if (varExpr) {
           result = varExpr.callFn(args);
         }
       }
@@ -374,7 +374,7 @@ class _AstToIrVisitor implements cdAst.AstVisitor {
     const receiver: o.Expression = this.visit(ast.receiver, _Mode.Expression);
     if (receiver === this._implicitReceiver) {
       const varExpr = this._getLocal(ast.name);
-      if (isPresent(varExpr)) {
+      if (varExpr) {
         throw new Error('Cannot assign to a reference or variable!');
       }
     }

modules/@angular/compiler/src/compiler_util/render_util.ts

@@ -7,75 +7,69 @@
  */
 import {SecurityContext} from '@angular/core';
 
-import {isPresent} from '../facade/lang';
 import {Identifiers, createIdentifier} from '../identifiers';
 import * as o from '../output/output_ast';
 import {EMPTY_STATE as EMPTY_ANIMATION_STATE} from '../private_import_core';
 import {BoundElementPropertyAst, BoundEventAst, PropertyBindingType} from '../template_parser/template_ast';
 
+import {isFirstViewCheck} from './binding_util';
+import {ConvertPropertyBindingResult} from './expression_converter';
 import {createEnumExpression} from './identifier_util';
 
-export function writeToRenderer(
-    view: o.Expression, boundProp: BoundElementPropertyAst, renderElement: o.Expression,
-    renderValue: o.Expression, logBindingUpdate: boolean,
+export function createCheckRenderBindingStmt(
+    view: o.Expression, renderElement: o.Expression, boundProp: BoundElementPropertyAst,
+    oldValue: o.ReadPropExpr, evalResult: ConvertPropertyBindingResult,
     securityContextExpression?: o.Expression): o.Statement[] {
-  const updateStmts: o.Statement[] = [];
-  const renderer = view.prop('renderer');
-  renderValue = sanitizedValue(view, boundProp, renderValue, securityContextExpression);
+  const checkStmts: o.Statement[] = [...evalResult.stmts];
+  const securityContext = calcSecurityContext(boundProp, securityContextExpression);
   switch (boundProp.type) {
     case PropertyBindingType.Property:
-      if (logBindingUpdate) {
-        updateStmts.push(
-            o.importExpr(createIdentifier(Identifiers.setBindingDebugInfo))
-                .callFn([renderer, renderElement, o.literal(boundProp.name), renderValue])
-                .toStmt());
-      }
-      updateStmts.push(
-          renderer
-              .callMethod(
-                  'setElementProperty', [renderElement, o.literal(boundProp.name), renderValue])
-              .toStmt());
+      checkStmts.push(o.importExpr(createIdentifier(Identifiers.checkRenderProperty))
+                          .callFn([
+                            view, renderElement, o.literal(boundProp.name), oldValue,
+                            oldValue.set(evalResult.currValExpr),
+                            evalResult.forceUpdate || o.literal(false), securityContext
+                          ])
+                          .toStmt());
       break;
     case PropertyBindingType.Attribute:
-      renderValue =
-          renderValue.isBlank().conditional(o.NULL_EXPR, renderValue.callMethod('toString', []));
-      updateStmts.push(
-          renderer
-              .callMethod(
-                  'setElementAttribute', [renderElement, o.literal(boundProp.name), renderValue])
-              .toStmt());
+      checkStmts.push(o.importExpr(createIdentifier(Identifiers.checkRenderAttribute))
+                          .callFn([
+                            view, renderElement, o.literal(boundProp.name), oldValue,
+                            oldValue.set(evalResult.currValExpr),
+                            evalResult.forceUpdate || o.literal(false), securityContext
+                          ])
+                          .toStmt());
       break;
     case PropertyBindingType.Class:
-      updateStmts.push(
-          renderer
-              .callMethod(
-                  'setElementClass', [renderElement, o.literal(boundProp.name), renderValue])
+      checkStmts.push(
+          o.importExpr(createIdentifier(Identifiers.checkRenderClass))
+              .callFn([
+                view, renderElement, o.literal(boundProp.name), oldValue,
+                oldValue.set(evalResult.currValExpr), evalResult.forceUpdate || o.literal(false)
+              ])
               .toStmt());
       break;
     case PropertyBindingType.Style:
-      let strValue: o.Expression = renderValue.callMethod('toString', []);
-      if (isPresent(boundProp.unit)) {
-        strValue = strValue.plus(o.literal(boundProp.unit));
-      }
-
-      renderValue = renderValue.isBlank().conditional(o.NULL_EXPR, strValue);
-      updateStmts.push(
-          renderer
-              .callMethod(
-                  'setElementStyle', [renderElement, o.literal(boundProp.name), renderValue])
+      checkStmts.push(
+          o.importExpr(createIdentifier(Identifiers.checkRenderStyle))
+              .callFn([
+                view, renderElement, o.literal(boundProp.name), o.literal(boundProp.unit), oldValue,
+                oldValue.set(evalResult.currValExpr), evalResult.forceUpdate || o.literal(false),
+                securityContext
+              ])
               .toStmt());
       break;
     case PropertyBindingType.Animation:
       throw new Error('Illegal state: Should not come here!');
   }
-  return updateStmts;
+  return checkStmts;
 }
 
-function sanitizedValue(
-    view: o.Expression, boundProp: BoundElementPropertyAst, renderValue: o.Expression,
-    securityContextExpression?: o.Expression): o.Expression {
+function calcSecurityContext(
+    boundProp: BoundElementPropertyAst, securityContextExpression?: o.Expression): o.Expression {
   if (boundProp.securityContext === SecurityContext.NONE) {
-    return renderValue;  // No sanitization needed.
+    return o.NULL_EXPR;  // No sanitization needed.
   }
   if (!boundProp.needsRuntimeSecurityContext) {
     securityContextExpression =
@@ -84,15 +78,13 @@ function sanitizedValue(
   if (!securityContextExpression) {
     throw new Error(`internal error, no SecurityContext given ${boundProp.name}`);
   }
-  const ctx = view.prop('viewUtils').prop('sanitizer');
-  const args = [securityContextExpression, renderValue];
-  return ctx.callMethod('sanitize', args);
+  return securityContextExpression;
 }
 
-export function triggerAnimation(
+export function createCheckAnimationBindingStmts(
     view: o.Expression, componentView: o.Expression, boundProp: BoundElementPropertyAst,
     boundOutputs: BoundEventAst[], eventListener: o.Expression, renderElement: o.Expression,
-    renderValue: o.Expression, lastRenderValue: o.Expression) {
+    oldValue: o.ReadPropExpr, evalResult: ConvertPropertyBindingResult) {
   const detachStmts: o.Statement[] = [];
   const updateStmts: o.Statement[] = [];
 
@@ -104,22 +96,21 @@ export function triggerAnimation(
   // it's important to normalize the void value as `void` explicitly
   // so that the styles data can be obtained from the stringmap
   const emptyStateValue = o.literal(EMPTY_ANIMATION_STATE);
-  const unitializedValue = o.importExpr(createIdentifier(Identifiers.UNINITIALIZED));
   const animationTransitionVar = o.variable('animationTransition_' + animationName);
 
   updateStmts.push(
       animationTransitionVar
           .set(animationFnExpr.callFn([
-            view, renderElement,
-            lastRenderValue.equals(unitializedValue).conditional(emptyStateValue, lastRenderValue),
-            renderValue.equals(unitializedValue).conditional(emptyStateValue, renderValue)
+            view, renderElement, isFirstViewCheck(view).conditional(emptyStateValue, oldValue),
+            evalResult.currValExpr
           ]))
           .toDeclStmt());
+  updateStmts.push(oldValue.set(evalResult.currValExpr).toStmt());
 
-  detachStmts.push(
-      animationTransitionVar
-          .set(animationFnExpr.callFn([view, renderElement, lastRenderValue, emptyStateValue]))
-          .toDeclStmt());
+  detachStmts.push(animationTransitionVar
+                       .set(animationFnExpr.callFn(
+                           [view, renderElement, evalResult.currValExpr, emptyStateValue]))
+                       .toDeclStmt());
 
   const registerStmts: o.Statement[] = [];
   const animationStartMethodExists = boundOutputs.find(
@@ -151,5 +142,14 @@ export function triggerAnimation(
   updateStmts.push(...registerStmts);
   detachStmts.push(...registerStmts);
 
-  return {updateStmts, detachStmts};
+  const checkUpdateStmts: o.Statement[] = [
+    ...evalResult.stmts,
+    new o.IfStmt(
+        o.importExpr(createIdentifier(Identifiers.checkBinding)).callFn([
+          view, oldValue, evalResult.currValExpr, evalResult.forceUpdate || o.literal(false)
+        ]),
+        updateStmts)
+  ];
+  const checkDetachStmts: o.Statement[] = [...evalResult.stmts, ...detachStmts];
+  return {checkUpdateStmts, checkDetachStmts};
 }

modules/@angular/compiler/src/directive_normalizer.ts

@@ -6,11 +6,11 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Component, ViewEncapsulation} from '@angular/core';
+import {ViewEncapsulation} from '@angular/core';
 
-import {CompileAnimationEntryMetadata, CompileDirectiveMetadata, CompileStylesheetMetadata, CompileTemplateMetadata, CompileTypeMetadata} from './compile_metadata';
+import {CompileAnimationEntryMetadata, CompileDirectiveMetadata, CompileStylesheetMetadata, CompileTemplateMetadata} from './compile_metadata';
 import {CompilerConfig} from './config';
-import {isBlank, isPresent, stringify} from './facade/lang';
+import {stringify} from './facade/lang';
 import {CompilerInjectable} from './injectable';
 import * as html from './ml_parser/ast';
 import {HtmlParser} from './ml_parser/html_parser';
@@ -41,9 +41,9 @@ export class DirectiveNormalizer {
       private _resourceLoader: ResourceLoader, private _urlResolver: UrlResolver,
       private _htmlParser: HtmlParser, private _config: CompilerConfig) {}
 
-  clearCache() { this._resourceLoaderCache.clear(); }
+  clearCache(): void { this._resourceLoaderCache.clear(); }
 
-  clearCacheFor(normalizedDirective: CompileDirectiveMetadata) {
+  clearCacheFor(normalizedDirective: CompileDirectiveMetadata): void {
     if (!normalizedDirective.isComponent) {
       return;
     }
@@ -65,10 +65,18 @@ export class DirectiveNormalizer {
       SyncAsyncResult<CompileTemplateMetadata> {
     let normalizedTemplateSync: CompileTemplateMetadata = null;
     let normalizedTemplateAsync: Promise<CompileTemplateMetadata>;
-    if (isPresent(prenormData.template)) {
+    if (prenormData.template != null) {
+      if (typeof prenormData.template !== 'string') {
+        throw new SyntaxError(
+            `The template specified for component ${stringify(prenormData.componentType)} is not a string`);
+      }
       normalizedTemplateSync = this.normalizeTemplateSync(prenormData);
       normalizedTemplateAsync = Promise.resolve(normalizedTemplateSync);
     } else if (prenormData.templateUrl) {
+      if (typeof prenormData.templateUrl !== 'string') {
+        throw new SyntaxError(
+            `The templateUrl specified for component ${stringify(prenormData.componentType)} is not a string`);
+      }
       normalizedTemplateAsync = this.normalizeTemplateAsync(prenormData);
     } else {
       throw new SyntaxError(
@@ -102,11 +110,12 @@ export class DirectiveNormalizer {
       templateAbsUrl: string): CompileTemplateMetadata {
     const interpolationConfig = InterpolationConfig.fromArray(prenomData.interpolation);
     const rootNodesAndErrors = this._htmlParser.parse(
-        template, stringify(prenomData.componentType), false, interpolationConfig);
+        template, stringify(prenomData.componentType), true, interpolationConfig);
     if (rootNodesAndErrors.errors.length > 0) {
       const errorString = rootNodesAndErrors.errors.join('\n');
       throw new SyntaxError(`Template parse errors:\n${errorString}`);
     }
+
     const templateMetadataStyles = this.normalizeStylesheet(new CompileStylesheetMetadata({
       styles: prenomData.styles,
       styleUrls: prenomData.styleUrls,
@@ -119,7 +128,7 @@ export class DirectiveNormalizer {
         {styles: visitor.styles, styleUrls: visitor.styleUrls, moduleUrl: templateAbsUrl}));
 
     let encapsulation = prenomData.encapsulation;
-    if (isBlank(encapsulation)) {
+    if (encapsulation == null) {
       encapsulation = this._config.defaultEncapsulation;
     }
 
@@ -228,9 +237,13 @@ class TemplatePreparseVisitor implements html.Visitor {
     return null;
   }
 
+  visitExpansion(ast: html.Expansion, context: any): any { html.visitAll(this, ast.cases); }
+
+  visitExpansionCase(ast: html.ExpansionCase, context: any): any {
+    html.visitAll(this, ast.expression);
+  }
+
   visitComment(ast: html.Comment, context: any): any { return null; }
   visitAttribute(ast: html.Attribute, context: any): any { return null; }
   visitText(ast: html.Text, context: any): any { return null; }
-  visitExpansion(ast: html.Expansion, context: any): any { return null; }
-  visitExpansionCase(ast: html.ExpansionCase, context: any): any { return null; }
 }

modules/@angular/compiler/src/directive_resolver.ts

@@ -14,8 +14,6 @@ import {CompilerInjectable} from './injectable';
 import {ReflectorReader, reflector} from './private_import_core';
 import {splitAtColon} from './util';
 
-
-
 /*
  * Resolve a `Type` for {@link Directive}.
  *

modules/@angular/compiler/src/directive_wrapper_compiler.ts

@@ -6,10 +6,10 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CompileDirectiveMetadata, CompileDirectiveSummary, CompileIdentifierMetadata, identifierModuleUrl, identifierName} from './compile_metadata';
-import {createCheckBindingField, createCheckBindingStmt} from './compiler_util/binding_util';
+import {CompileDirectiveMetadata, CompileDirectiveSummary, CompileIdentifierMetadata, dirWrapperClassName, identifierModuleUrl, identifierName} from './compile_metadata';
+import {createCheckBindingField, isFirstViewCheck} from './compiler_util/binding_util';
 import {EventHandlerVars, convertActionBinding, convertPropertyBinding} from './compiler_util/expression_converter';
-import {triggerAnimation, writeToRenderer} from './compiler_util/render_util';
+import {createCheckAnimationBindingStmts, createCheckRenderBindingStmt} from './compiler_util/render_util';
 import {CompilerConfig} from './config';
 import {Parser} from './expression_parser/parser';
 import {Identifiers, createIdentifier} from './identifiers';
@@ -18,7 +18,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from './ml_parser/interpolation_config';
 import {ClassBuilder, createClassStmt} from './output/class_builder';
 import * as o from './output/output_ast';
 import {ParseError, ParseErrorLevel, ParseLocation, ParseSourceFile, ParseSourceSpan} from './parse_util';
-import {Console, LifecycleHooks, isDefaultChangeDetectionStrategy} from './private_import_core';
+import {Console, LifecycleHooks} from './private_import_core';
 import {ElementSchemaRegistry} from './schema/element_schema_registry';
 import {BindingParser} from './template_parser/binding_parser';
 import {BoundElementPropertyAst, BoundEventAst} from './template_parser/template_ast';
@@ -32,8 +32,8 @@ const CHANGES_FIELD_NAME = '_changes';
 const CHANGED_FIELD_NAME = '_changed';
 const EVENT_HANDLER_FIELD_NAME = '_eventHandler';
 
+const CHANGE_VAR = o.variable('change');
 const CURR_VALUE_VAR = o.variable('currValue');
-const THROW_ON_CHANGE_VAR = o.variable('throwOnChange');
 const FORCE_UPDATE_VAR = o.variable('forceUpdate');
 const VIEW_VAR = o.variable('view');
 const COMPONENT_VIEW_VAR = o.variable('componentView');
@@ -52,10 +52,6 @@ const RESET_CHANGES_STMT = o.THIS_EXPR.prop(CHANGES_FIELD_NAME).set(o.literalMap
  */
 @CompilerInjectable()
 export class DirectiveWrapperCompiler {
-  static dirWrapperClassName(id: CompileIdentifierMetadata) {
-    return `Wrapper_${identifierName(id)}`;
-  }
-
   constructor(
       private compilerConfig: CompilerConfig, private _exprParser: Parser,
       private _schemaRegistry: ElementSchemaRegistry, private _console: Console) {}
@@ -128,14 +124,14 @@ class DirectiveWrapperBuilder implements ClassBuilder {
       new o.ClassMethod('ngOnDestroy', [], this.destroyStmts),
     ];
 
-
     const fields: o.ClassField[] = [
       new o.ClassField(EVENT_HANDLER_FIELD_NAME, o.FUNCTION_TYPE, [o.StmtModifier.Private]),
       new o.ClassField(CONTEXT_FIELD_NAME, o.importType(this.dirMeta.type)),
       new o.ClassField(CHANGED_FIELD_NAME, o.BOOL_TYPE, [o.StmtModifier.Private]),
     ];
-    const ctorStmts: o.Statement[] =
-        [o.THIS_EXPR.prop(CHANGED_FIELD_NAME).set(o.literal(false)).toStmt()];
+    const ctorStmts: o.Statement[] = [
+      o.THIS_EXPR.prop(CHANGED_FIELD_NAME).set(o.literal(false)).toStmt(),
+    ];
     if (this.genChanges) {
       fields.push(new o.ClassField(
           CHANGES_FIELD_NAME, new o.MapType(o.DYNAMIC_TYPE), [o.StmtModifier.Private]));
@@ -149,7 +145,7 @@ class DirectiveWrapperBuilder implements ClassBuilder {
             .toStmt());
 
     return createClassStmt({
-      name: DirectiveWrapperCompiler.dirWrapperClassName(this.dirMeta.type),
+      name: dirWrapperClassName(this.dirMeta.type.reference),
       ctorParams: dirDepParamNames.map((paramName) => new o.FnParam(paramName, o.DYNAMIC_TYPE)),
       builders: [{fields, ctorStmts, methods}, this]
     });
@@ -184,14 +180,14 @@ function addNgDoCheckMethod(builder: DirectiveWrapperBuilder) {
 
   if (builder.ngOnInit) {
     lifecycleStmts.push(new o.IfStmt(
-        VIEW_VAR.prop('numberOfChecks').identical(new o.LiteralExpr(0)),
+        isFirstViewCheck(VIEW_VAR),
         [o.THIS_EXPR.prop(CONTEXT_FIELD_NAME).callMethod('ngOnInit', []).toStmt()]));
   }
   if (builder.ngDoCheck) {
     lifecycleStmts.push(o.THIS_EXPR.prop(CONTEXT_FIELD_NAME).callMethod('ngDoCheck', []).toStmt());
   }
   if (lifecycleStmts.length > 0) {
-    stmts.push(new o.IfStmt(o.not(THROW_ON_CHANGE_VAR), lifecycleStmts));
+    stmts.push(new o.IfStmt(o.not(VIEW_VAR.prop('throwOnChange')), lifecycleStmts));
   }
   stmts.push(new o.ReturnStatement(changedVar));
 
@@ -201,7 +197,6 @@ function addNgDoCheckMethod(builder: DirectiveWrapperBuilder) {
         new o.FnParam(
             VIEW_VAR.name, o.importType(createIdentifier(Identifiers.AppView), [o.DYNAMIC_TYPE])),
         new o.FnParam(RENDER_EL_VAR.name, o.DYNAMIC_TYPE),
-        new o.FnParam(THROW_ON_CHANGE_VAR.name, o.BOOL_TYPE),
       ],
       stmts, o.BOOL_TYPE));
 }
@@ -211,24 +206,35 @@ function addCheckInputMethod(input: string, builder: DirectiveWrapperBuilder) {
   const onChangeStatements: o.Statement[] = [
     o.THIS_EXPR.prop(CHANGED_FIELD_NAME).set(o.literal(true)).toStmt(),
     o.THIS_EXPR.prop(CONTEXT_FIELD_NAME).prop(input).set(CURR_VALUE_VAR).toStmt(),
+    field.expression.set(CURR_VALUE_VAR).toStmt()
   ];
+  let methodBody: o.Statement[];
   if (builder.genChanges) {
-    onChangeStatements.push(o.THIS_EXPR.prop(CHANGES_FIELD_NAME)
-                                .key(o.literal(input))
-                                .set(o.importExpr(createIdentifier(Identifiers.SimpleChange))
-                                         .instantiate([field.expression, CURR_VALUE_VAR]))
-                                .toStmt());
+    onChangeStatements.push(
+        o.THIS_EXPR.prop(CHANGES_FIELD_NAME).key(o.literal(input)).set(CHANGE_VAR).toStmt());
+    methodBody = [
+      CHANGE_VAR
+          .set(o.importExpr(createIdentifier(Identifiers.checkBindingChange)).callFn([
+            VIEW_VAR, field.expression, CURR_VALUE_VAR, FORCE_UPDATE_VAR
+          ]))
+          .toDeclStmt(),
+      new o.IfStmt(CHANGE_VAR, onChangeStatements)
+    ];
+  } else {
+    methodBody = [new o.IfStmt(
+        o.importExpr(createIdentifier(Identifiers.checkBinding)).callFn([
+          VIEW_VAR, field.expression, CURR_VALUE_VAR, FORCE_UPDATE_VAR
+        ]),
+        onChangeStatements)];
   }
 
-  const methodBody: o.Statement[] = createCheckBindingStmt(
-      {currValExpr: CURR_VALUE_VAR, forceUpdate: FORCE_UPDATE_VAR, stmts: []}, field.expression,
-      THROW_ON_CHANGE_VAR, onChangeStatements);
   builder.methods.push(new o.ClassMethod(
       `check_${input}`,
       [
+        new o.FnParam(
+            VIEW_VAR.name, o.importType(createIdentifier(Identifiers.AppView), [o.DYNAMIC_TYPE])),
         new o.FnParam(CURR_VALUE_VAR.name, o.DYNAMIC_TYPE),
-        new o.FnParam(THROW_ON_CHANGE_VAR.name, o.BOOL_TYPE),
-        new o.FnParam(FORCE_UPDATE_VAR.name, o.BOOL_TYPE),
+        new o.FnParam(FORCE_UPDATE_VAR.name, o.BOOL_TYPE)
       ],
       methodBody));
 }
@@ -244,7 +250,6 @@ function addCheckHostMethod(
         COMPONENT_VIEW_VAR.name,
         o.importType(createIdentifier(Identifiers.AppView), [o.DYNAMIC_TYPE])),
     new o.FnParam(RENDER_EL_VAR.name, o.DYNAMIC_TYPE),
-    new o.FnParam(THROW_ON_CHANGE_VAR.name, o.BOOL_TYPE),
   ];
   hostProps.forEach((hostProp, hostPropIdx) => {
     const field = createCheckBindingField(builder);
@@ -259,23 +264,18 @@ function addCheckHostMethod(
       methodParams.push(new o.FnParam(
           securityContextExpr.name, o.importType(createIdentifier(Identifiers.SecurityContext))));
     }
-    let checkBindingStmts: o.Statement[];
     if (hostProp.isAnimation) {
-      const {updateStmts, detachStmts} = triggerAnimation(
+      const {checkUpdateStmts, checkDetachStmts} = createCheckAnimationBindingStmts(
           VIEW_VAR, COMPONENT_VIEW_VAR, hostProp, hostEvents,
           o.THIS_EXPR.prop(EVENT_HANDLER_FIELD_NAME)
               .or(o.importExpr(createIdentifier(Identifiers.noop))),
-          RENDER_EL_VAR, evalResult.currValExpr, field.expression);
-      checkBindingStmts = updateStmts;
-      builder.detachStmts.push(...detachStmts);
+          RENDER_EL_VAR, field.expression, evalResult);
+      builder.detachStmts.push(...checkDetachStmts);
+      stmts.push(...checkUpdateStmts);
     } else {
-      checkBindingStmts = writeToRenderer(
-          VIEW_VAR, hostProp, RENDER_EL_VAR, evalResult.currValExpr,
-          builder.compilerConfig.logBindingUpdate, securityContextExpr);
+      stmts.push(...createCheckRenderBindingStmt(
+          VIEW_VAR, RENDER_EL_VAR, hostProp, field.expression, evalResult, securityContextExpr));
     }
-
-    stmts.push(...createCheckBindingStmt(
-        evalResult, field.expression, THROW_ON_CHANGE_VAR, checkBindingStmts));
   });
   builder.methods.push(new o.ClassMethod('checkHost', methodParams, stmts));
 }
@@ -385,20 +385,19 @@ export class DirectiveWrapperExpressions {
     return dirWrapper.prop(CONTEXT_FIELD_NAME);
   }
 
-  static ngDoCheck(
-      dirWrapper: o.Expression, view: o.Expression, renderElement: o.Expression,
-      throwOnChange: o.Expression): o.Expression {
-    return dirWrapper.callMethod('ngDoCheck', [view, renderElement, throwOnChange]);
+  static ngDoCheck(dirWrapper: o.Expression, view: o.Expression, renderElement: o.Expression, ):
+      o.Expression {
+    return dirWrapper.callMethod('ngDoCheck', [view, renderElement]);
   }
   static checkHost(
       hostProps: BoundElementPropertyAst[], dirWrapper: o.Expression, view: o.Expression,
-      componentView: o.Expression, renderElement: o.Expression, throwOnChange: o.Expression,
+      componentView: o.Expression, renderElement: o.Expression,
       runtimeSecurityContexts: o.Expression[]): o.Statement[] {
     if (hostProps.length) {
       return [dirWrapper
                   .callMethod(
-                      'checkHost', [view, componentView, renderElement, throwOnChange].concat(
-                                       runtimeSecurityContexts))
+                      'checkHost',
+                      [view, componentView, renderElement].concat(runtimeSecurityContexts))
                   .toStmt()];
     } else {
       return [];

modules/@angular/compiler/src/expression_parser/lexer.ts

@@ -7,7 +7,7 @@
  */
 
 import * as chars from '../chars';
-import {NumberWrapper, isPresent} from '../facade/lang';
+import {NumberWrapper} from '../facade/lang';
 import {CompilerInjectable} from '../injectable';
 
 export enum TokenType {
@@ -120,7 +120,7 @@ function newErrorToken(index: number, message: string): Token {
   return new Token(index, TokenType.Error, 0, message);
 }
 
-export var EOF: Token = new Token(-1, TokenType.Character, 0, '');
+export const EOF: Token = new Token(-1, TokenType.Character, 0, '');
 
 class _Scanner {
   length: number;
@@ -241,7 +241,7 @@ class _Scanner {
       this.advance();
       str += two;
     }
-    if (isPresent(threeCode) && this.peek == threeCode) {
+    if (threeCode != null && this.peek == threeCode) {
       this.advance();
       str += three;
     }

modules/@angular/compiler/src/i18n/extractor.ts

@@ -109,7 +109,7 @@ export class Extractor {
     const resolver = new CompileMetadataResolver(
         new NgModuleResolver(staticReflector), new DirectiveResolver(staticReflector),
         new PipeResolver(staticReflector), summaryResolver, elementSchemaRegistry, normalizer,
-        staticReflector);
+        symbolCache, staticReflector);
 
     // TODO(vicb): implicit tags & attributes
     const messageBundle = new MessageBundle(htmlParser, [], {});

modules/@angular/compiler/src/i18n/extractor_merger.ts

@@ -55,20 +55,22 @@ enum _VisitorMode {
  * @internal
  */
 class _Visitor implements html.Visitor {
+  private _depth: number;
+
   // <el i18n>...</el>
   private _inI18nNode: boolean;
-  private _depth: number;
   private _inImplicitNode: boolean;
 
   // <!--i18n-->...<!--/i18n-->
+  private _inI18nBlock: boolean;
   private _blockMeaningAndDesc: string;
   private _blockChildren: html.Node[];
   private _blockStartDepth: number;
-  private _inI18nBlock: boolean;
 
   // {<icu message>}
   private _inIcu: boolean;
 
+  // set to void 0 when not in a section
   private _msgCountAtSectionStart: number;
   private _errors: I18nError[];
   private _mode: _VisitorMode;
@@ -210,50 +212,31 @@ class _Visitor implements html.Visitor {
     this._depth++;
     const wasInI18nNode = this._inI18nNode;
     const wasInImplicitNode = this._inImplicitNode;
-    let childNodes: html.Node[];
+    let childNodes: html.Node[] = [];
+    let translatedChildNodes: html.Node[];
 
-    // Extract only top level nodes with the (implicit) "i18n" attribute if not in a block or an ICU
-    // message
+    // Extract:
+    // - top level nodes with the (implicit) "i18n" attribute if not already in a section
+    // - ICU messages
     const i18nAttr = _getI18nAttr(el);
+    const i18nMeta = i18nAttr ? i18nAttr.value : '';
     const isImplicit = this._implicitTags.some(tag => el.name === tag) && !this._inIcu &&
         !this._isInTranslatableSection;
     const isTopLevelImplicit = !wasInImplicitNode && isImplicit;
-    this._inImplicitNode = this._inImplicitNode || isImplicit;
+    this._inImplicitNode = wasInImplicitNode || isImplicit;
 
     if (!this._isInTranslatableSection && !this._inIcu) {
-      if (i18nAttr) {
-        // explicit translation
+      if (i18nAttr || isTopLevelImplicit) {
         this._inI18nNode = true;
-        const message = this._addMessage(el.children, i18nAttr.value);
-        childNodes = this._translateMessage(el, message);
-      } else if (isTopLevelImplicit) {
-        // implicit translation
-        this._inI18nNode = true;
-        const message = this._addMessage(el.children);
-        childNodes = this._translateMessage(el, message);
+        const message = this._addMessage(el.children, i18nMeta);
+        translatedChildNodes = this._translateMessage(el, message);
       }
 
       if (this._mode == _VisitorMode.Extract) {
         const isTranslatable = i18nAttr || isTopLevelImplicit;
-        if (isTranslatable) {
-          this._openTranslatableSection(el);
-        }
+        if (isTranslatable) this._openTranslatableSection(el);
         html.visitAll(this, el.children);
-        if (isTranslatable) {
-          this._closeTranslatableSection(el, el.children);
-        }
-      }
-
-      if (this._mode === _VisitorMode.Merge && !i18nAttr && !isTopLevelImplicit) {
-        childNodes = [];
-        el.children.forEach(child => {
-          const visited = child.visit(this, context);
-          if (visited && !this._isInTranslatableSection) {
-            // Do not add the children from translatable sections (= i18n blocks here)
-            // They will be added when the section is close (i.e. on `<!-- /i18n -->`)
-            childNodes = childNodes.concat(visited);
-          }
-        });
+        if (isTranslatable) this._closeTranslatableSection(el, el.children);
       }
     } else {
       if (i18nAttr || isTopLevelImplicit) {
@@ -265,19 +248,18 @@ class _Visitor implements html.Visitor {
         // Descend into child nodes for extraction
         html.visitAll(this, el.children);
       }
+    }
 
-      if (this._mode == _VisitorMode.Merge) {
-        // Translate attributes in ICU messages
-        childNodes = [];
-        el.children.forEach(child => {
-          const visited = child.visit(this, context);
-          if (visited && !this._isInTranslatableSection) {
-            // Do not add the children from translatable sections (= i18n blocks here)
-            // They will be added when the section is close (i.e. on `<!-- /i18n -->`)
-            childNodes = childNodes.concat(visited);
-          }
-        });
-      }
+    if (this._mode === _VisitorMode.Merge) {
+      const visitNodes = translatedChildNodes || el.children;
+      visitNodes.forEach(child => {
+        const visited = child.visit(this, context);
+        if (visited && !this._isInTranslatableSection) {
+          // Do not add the children from translatable sections (= i18n blocks here)
+          // They will be added later in this loop when the block closes (i.e. on `<!-- /i18n -->`)
+          childNodes = childNodes.concat(visited);
+        }
+      });
     }
 
     this._visitAttributesOf(el);
@@ -287,7 +269,6 @@ class _Visitor implements html.Visitor {
     this._inImplicitNode = wasInImplicitNode;
 
     if (this._mode === _VisitorMode.Merge) {
-      // There are no childNodes in translatable sections - those nodes will be replace anyway
       const translatedAttrs = this._translateAttributes(el);
       return new html.Element(
           el.name, translatedAttrs, childNodes, el.sourceSpan, el.startSourceSpan,
@@ -422,7 +403,7 @@ class _Visitor implements html.Visitor {
   }
 
   /**
-   * Marks the start of a section, see `_endSection`
+   * Marks the start of a section, see `_closeTranslatableSection`
    */
   private _openTranslatableSection(node: html.Node): void {
     if (this._isInTranslatableSection) {
@@ -434,7 +415,7 @@ class _Visitor implements html.Visitor {
 
   /**
    * A translatable section could be:
-   * - a translatable element,
+   * - the content of translatable element,
    * - nodes between `<!-- i18n -->` and `<!-- /i18n -->` comments
    */
   private get _isInTranslatableSection(): boolean {

modules/@angular/compiler/src/identifiers.ts

@@ -6,11 +6,10 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {ANALYZE_FOR_ENTRY_COMPONENTS, AnimationTransitionEvent, ChangeDetectionStrategy, ChangeDetectorRef, ComponentFactory, ComponentFactoryResolver, ComponentRef, ElementRef, Injector, LOCALE_ID, NgModuleFactory, QueryList, RenderComponentType, Renderer, SecurityContext, SimpleChange, TRANSLATIONS_FORMAT, TemplateRef, ViewContainerRef, ViewEncapsulation} from '@angular/core';
+import {ANALYZE_FOR_ENTRY_COMPONENTS, ChangeDetectionStrategy, ChangeDetectorRef, ComponentFactory, ComponentFactoryResolver, ComponentRef, ElementRef, Injector, LOCALE_ID, NgModuleFactory, QueryList, RenderComponentType, Renderer, SecurityContext, SimpleChange, TRANSLATIONS_FORMAT, TemplateRef, ViewContainerRef, ViewEncapsulation} from '@angular/core';
 
-import {StaticSymbol} from './aot/static_symbol';
-import {CompileIdentifierMetadata, CompileTokenMetadata, identifierModuleUrl, identifierName} from './compile_metadata';
-import {AnimationGroupPlayer, AnimationKeyframe, AnimationSequencePlayer, AnimationStyles, AnimationTransition, AppView, ChangeDetectorStatus, CodegenComponentFactoryResolver, ComponentRef_, DebugAppView, DebugContext, NgModuleInjector, NoOpAnimationPlayer, StaticNodeDebugInfo, TemplateRef_, UNINITIALIZED, ValueUnwrapper, ViewContainer, ViewType, balanceAnimationKeyframes, clearStyles, collectAndResolveStyles, devModeEqual, prepareFinalAnimationStyles, reflector, registerModuleFactory, renderStyles, view_utils} from './private_import_core';
+import {CompileIdentifierMetadata, CompileTokenMetadata} from './compile_metadata';
+import {AnimationGroupPlayer, AnimationKeyframe, AnimationSequencePlayer, AnimationStyles, AnimationTransition, AppView, ChangeDetectorStatus, CodegenComponentFactoryResolver, ComponentRef_, DebugAppView, DebugContext, NgModuleInjector, NoOpAnimationPlayer, StaticNodeDebugInfo, TemplateRef_, ValueUnwrapper, ViewContainer, ViewType, balanceAnimationKeyframes, clearStyles, collectAndResolveStyles, devModeEqual, prepareFinalAnimationStyles, reflector, registerModuleFactory, renderStyles, view_utils} from './private_import_core';
 
 const APP_VIEW_MODULE_URL = assetUrl('core', 'linker/view');
 const VIEW_UTILS_MODULE_URL = assetUrl('core', 'linker/view_utils');
@@ -161,8 +160,6 @@ export class Identifiers {
   };
   static SimpleChange:
       IdentifierSpec = {name: 'SimpleChange', moduleUrl: CD_MODULE_URL, runtime: SimpleChange};
-  static UNINITIALIZED:
-      IdentifierSpec = {name: 'UNINITIALIZED', moduleUrl: CD_MODULE_URL, runtime: UNINITIALIZED};
   static ChangeDetectorStatus: IdentifierSpec = {
     name: 'ChangeDetectorStatus',
     moduleUrl: CD_MODULE_URL,
@@ -173,6 +170,36 @@ export class Identifiers {
     moduleUrl: VIEW_UTILS_MODULE_URL,
     runtime: view_utils.checkBinding
   };
+  static checkBindingChange: IdentifierSpec = {
+    name: 'checkBindingChange',
+    moduleUrl: VIEW_UTILS_MODULE_URL,
+    runtime: view_utils.checkBindingChange
+  };
+  static checkRenderText: IdentifierSpec = {
+    name: 'checkRenderText',
+    moduleUrl: VIEW_UTILS_MODULE_URL,
+    runtime: view_utils.checkRenderText
+  };
+  static checkRenderProperty: IdentifierSpec = {
+    name: 'checkRenderProperty',
+    moduleUrl: VIEW_UTILS_MODULE_URL,
+    runtime: view_utils.checkRenderProperty
+  };
+  static checkRenderAttribute: IdentifierSpec = {
+    name: 'checkRenderAttribute',
+    moduleUrl: VIEW_UTILS_MODULE_URL,
+    runtime: view_utils.checkRenderAttribute
+  };
+  static checkRenderClass: IdentifierSpec = {
+    name: 'checkRenderClass',
+    moduleUrl: VIEW_UTILS_MODULE_URL,
+    runtime: view_utils.checkRenderClass
+  };
+  static checkRenderStyle: IdentifierSpec = {
+    name: 'checkRenderStyle',
+    moduleUrl: VIEW_UTILS_MODULE_URL,
+    runtime: view_utils.checkRenderStyle
+  };
   static devModeEqual:
       IdentifierSpec = {name: 'devModeEqual', moduleUrl: CD_MODULE_URL, runtime: devModeEqual};
   static inlineInterpolate: IdentifierSpec = {

modules/@angular/compiler/src/jit/compiler.ts

@@ -6,13 +6,12 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Compiler, ComponentFactory, Injector, ModuleWithComponentFactories, NgModuleFactory, SchemaMetadata, Type} from '@angular/core';
+import {Compiler, ComponentFactory, Injector, ModuleWithComponentFactories, NgModuleFactory, Type} from '@angular/core';
 
 import {AnimationCompiler} from '../animation/animation_compiler';
 import {AnimationParser} from '../animation/animation_parser';
-import {CompileDirectiveMetadata, CompileIdentifierMetadata, CompileNgModuleMetadata, CompilePipeMetadata, ProviderMeta, createHostComponentMeta, identifierName} from '../compile_metadata';
+import {CompileDirectiveMetadata, CompileIdentifierMetadata, CompileNgModuleMetadata, ProviderMeta, ProxyClass, createHostComponentMeta, identifierName} from '../compile_metadata';
 import {CompilerConfig} from '../config';
-import {DirectiveNormalizer} from '../directive_normalizer';
 import {DirectiveWrapperCompiler} from '../directive_wrapper_compiler';
 import {stringify} from '../facade/lang';
 import {CompilerInjectable} from '../injectable';
@@ -21,10 +20,11 @@ import {NgModuleCompiler} from '../ng_module_compiler';
 import * as ir from '../output/output_ast';
 import {interpretStatements} from '../output/output_interpreter';
 import {jitStatements} from '../output/output_jit';
+import {view_utils} from '../private_import_core';
 import {CompiledStylesheet, StyleCompiler} from '../style_compiler';
 import {TemplateParser} from '../template_parser/template_parser';
 import {SyncAsyncResult} from '../util';
-import {ComponentFactoryDependency, DirectiveWrapperDependency, ViewClassDependency, ViewCompiler} from '../view_compiler/view_compiler';
+import {ViewCompiler} from '../view_compiler/view_compiler';
 
 
 
@@ -130,10 +130,6 @@ export class JitCompiler implements Compiler {
       const extraProviders = [this._metadataResolver.getProviderMetadata(new ProviderMeta(
           Compiler, {useFactory: () => new ModuleBoundCompiler(this, moduleMeta.type.reference)}))];
       const compileResult = this._ngModuleCompiler.compile(moduleMeta, extraProviders);
-      compileResult.dependencies.forEach((dep) => {
-        dep.placeholder.reference =
-            this._assertComponentKnown(dep.comp.reference, true).proxyComponentFactory;
-      });
       if (!this._compilerConfig.useJit) {
         ngModuleFactory =
             interpretStatements(compileResult.statements, compileResult.ngModuleFactoryVar);
@@ -168,7 +164,7 @@ export class JitCompiler implements Compiler {
             const template =
                 this._createCompiledHostTemplate(dirMeta.type.reference, localModuleMeta);
             templates.add(template);
-            allComponentFactories.push(template.proxyComponentFactory);
+            allComponentFactories.push(<ComponentFactory<any>>dirMeta.componentFactory);
           }
         }
       });
@@ -180,15 +176,16 @@ export class JitCompiler implements Compiler {
         const dirMeta = this._metadataResolver.getDirectiveMetadata(dirIdentifier.reference);
         if (dirMeta.isComponent) {
           dirMeta.entryComponents.forEach((entryComponentType) => {
-            const moduleMeta = moduleByDirective.get(entryComponentType.reference);
+            const moduleMeta = moduleByDirective.get(entryComponentType.componentType);
             templates.add(
-                this._createCompiledHostTemplate(entryComponentType.reference, moduleMeta));
+                this._createCompiledHostTemplate(entryComponentType.componentType, moduleMeta));
           });
         }
       });
       localModuleMeta.entryComponents.forEach((entryComponentType) => {
-        const moduleMeta = moduleByDirective.get(entryComponentType.reference);
-        templates.add(this._createCompiledHostTemplate(entryComponentType.reference, moduleMeta));
+        const moduleMeta = moduleByDirective.get(entryComponentType.componentType);
+        templates.add(
+            this._createCompiledHostTemplate(entryComponentType.componentType, moduleMeta));
       });
     });
     templates.forEach((template) => this._compileTemplate(template));
@@ -222,12 +219,12 @@ export class JitCompiler implements Compiler {
       const compMeta = this._metadataResolver.getDirectiveMetadata(compType);
       assertComponent(compMeta);
 
-      const HostClass = function HostClass() {};
-      (<any>HostClass).overriddenName = `${identifierName(compMeta.type)}_Host`;
-
-      const hostMeta = createHostComponentMeta(HostClass, compMeta);
-      compiledTemplate = new CompiledTemplate(
-          true, compMeta.selector, compMeta.type, hostMeta, ngModule, [compMeta.type]);
+      const componentFactory = <ComponentFactory<any>>compMeta.componentFactory;
+      const hostClass = this._metadataResolver.getHostComponentType(compType);
+      const hostMeta = createHostComponentMeta(
+          hostClass, compMeta, <any>view_utils.getComponentFactoryViewClass(componentFactory));
+      compiledTemplate =
+          new CompiledTemplate(true, compMeta.type, hostMeta, ngModule, [compMeta.type]);
       this._compiledHostTemplateCache.set(compType, compiledTemplate);
     }
     return compiledTemplate;
@@ -239,32 +236,12 @@ export class JitCompiler implements Compiler {
     if (!compiledTemplate) {
       assertComponent(compMeta);
       compiledTemplate = new CompiledTemplate(
-          false, compMeta.selector, compMeta.type, compMeta, ngModule,
-          ngModule.transitiveModule.directives);
+          false, compMeta.type, compMeta, ngModule, ngModule.transitiveModule.directives);
       this._compiledTemplateCache.set(compMeta.type.reference, compiledTemplate);
     }
     return compiledTemplate;
   }
 
-  private _assertComponentKnown(compType: any, isHost: boolean): CompiledTemplate {
-    const compiledTemplate = isHost ? this._compiledHostTemplateCache.get(compType) :
-                                      this._compiledTemplateCache.get(compType);
-    if (!compiledTemplate) {
-      throw new Error(
-          `Illegal state: Compiled view for component ${stringify(compType)} (host: ${isHost}) does not exist!`);
-    }
-    return compiledTemplate;
-  }
-
-  private _assertDirectiveWrapper(dirType: any): Type<any> {
-    const dirWrapper = this._compiledDirectiveWrapperCache.get(dirType);
-    if (!dirWrapper) {
-      throw new Error(
-          `Illegal state: Directive wrapper for ${stringify(dirType)} has not been compiled!`);
-    }
-    return dirWrapper;
-  }
-
   private _compileDirectiveWrapper(
       dirMeta: CompileDirectiveMetadata, moduleMeta: CompileNgModuleMetadata): void {
     const compileResult = this._directiveWrapperCompiler.compile(dirMeta);
@@ -277,6 +254,7 @@ export class JitCompiler implements Compiler {
           `/${identifierName(moduleMeta.type)}/${identifierName(dirMeta.type)}/wrapper.ngfactory.js`,
           statements, compileResult.dirWrapperClassVar);
     }
+    (<ProxyClass>dirMeta.wrapperType).setDelegate(directiveWrapperClass);
     this._compiledDirectiveWrapperCache.set(dirMeta.type.reference, directiveWrapperClass);
   }
 
@@ -304,21 +282,6 @@ export class JitCompiler implements Compiler {
     const compileResult = this._viewCompiler.compileComponent(
         compMeta, parsedTemplate, ir.variable(stylesCompileResult.componentStylesheet.stylesVar),
         pipes, compiledAnimations);
-    compileResult.dependencies.forEach((dep) => {
-      let depTemplate: CompiledTemplate;
-      if (dep instanceof ViewClassDependency) {
-        const vfd = <ViewClassDependency>dep;
-        depTemplate = this._assertComponentKnown(vfd.comp.reference, false);
-        vfd.placeholder.reference = depTemplate.proxyViewClass;
-      } else if (dep instanceof ComponentFactoryDependency) {
-        const cfd = <ComponentFactoryDependency>dep;
-        depTemplate = this._assertComponentKnown(cfd.comp.reference, true);
-        cfd.placeholder.reference = depTemplate.proxyComponentFactory;
-      } else if (dep instanceof DirectiveWrapperDependency) {
-        const dwd = <DirectiveWrapperDependency>dep;
-        dwd.placeholder.reference = this._assertDirectiveWrapper(dwd.dir.reference);
-      }
-    });
     const statements = stylesCompileResult.componentStylesheet.statements
                            .concat(...compiledAnimations.map(ca => ca.statements))
                            .concat(compileResult.statements);
@@ -358,30 +321,16 @@ export class JitCompiler implements Compiler {
 
 class CompiledTemplate {
   private _viewClass: Function = null;
-  proxyViewClass: Type<any>;
-  proxyComponentFactory: ComponentFactory<any>;
   isCompiled = false;
 
   constructor(
-      public isHost: boolean, selector: string, public compType: CompileIdentifierMetadata,
+      public isHost: boolean, public compType: CompileIdentifierMetadata,
       public compMeta: CompileDirectiveMetadata, public ngModule: CompileNgModuleMetadata,
-      public directives: CompileIdentifierMetadata[]) {
-    const self = this;
-    this.proxyViewClass = <any>function() {
-      if (!self._viewClass) {
-        throw new Error(
-            `Illegal state: CompiledTemplate for ${stringify(self.compType)} is not compiled yet!`);
-      }
-      return self._viewClass.apply(this, arguments);
-    };
-    this.proxyComponentFactory = isHost ?
-        new ComponentFactory<any>(selector, this.proxyViewClass, compType.reference) :
-        null;
-  }
+      public directives: CompileIdentifierMetadata[]) {}
 
   compiled(viewClass: Function) {
     this._viewClass = viewClass;
-    this.proxyViewClass.prototype = viewClass.prototype;
+    (<ProxyClass>this.compMeta.componentViewType).setDelegate(viewClass);
     this.isCompiled = true;
   }
 }

modules/@angular/compiler/src/jit/compiler_factory.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {COMPILER_OPTIONS, Compiler, CompilerFactory, CompilerOptions, Inject, Optional, PLATFORM_INITIALIZER, PlatformRef, Provider, ReflectiveInjector, TRANSLATIONS, TRANSLATIONS_FORMAT, Type, ViewEncapsulation, createPlatformFactory, isDevMode, platformCore} from '@angular/core';
+import {COMPILER_OPTIONS, Compiler, CompilerFactory, CompilerOptions, Inject, OpaqueToken, Optional, PLATFORM_INITIALIZER, PlatformRef, Provider, ReflectiveInjector, TRANSLATIONS, TRANSLATIONS_FORMAT, Type, ViewEncapsulation, createPlatformFactory, isDevMode, platformCore} from '@angular/core';
 
 import {AnimationParser} from '../animation/animation_parser';
 import {CompilerConfig} from '../config';
@@ -40,6 +40,8 @@ const _NO_RESOURCE_LOADER: ResourceLoader = {
           `No ResourceLoader implementation has been provided. Can't read the url "${url}"`);}
 };
 
+const baseHtmlParser = new OpaqueToken('HtmlParser');
+
 /**
  * A set of providers that provide `JitCompiler` and its dependencies to use for
  * template compilation.
@@ -52,17 +54,24 @@ export const COMPILER_PROVIDERS: Array<any|Type<any>|{[k: string]: any}|any[]> =
   Console,
   Lexer,
   Parser,
-  HtmlParser,
+  {
+    provide: baseHtmlParser,
+    useClass: HtmlParser,
+  },
   {
     provide: i18n.I18NHtmlParser,
     useFactory: (parser: HtmlParser, translations: string, format: string) =>
                     new i18n.I18NHtmlParser(parser, translations, format),
     deps: [
-      HtmlParser,
+      baseHtmlParser,
       [new Optional(), new Inject(TRANSLATIONS)],
       [new Optional(), new Inject(TRANSLATIONS_FORMAT)],
     ]
   },
+  {
+    provide: HtmlParser,
+    useExisting: i18n.I18NHtmlParser,
+  },
   TemplateParser,
   DirectiveNormalizer,
   CompileMetadataResolver,

modules/@angular/compiler/src/metadata_resolver.ts

@@ -6,16 +6,16 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {AnimationAnimateMetadata, AnimationEntryMetadata, AnimationGroupMetadata, AnimationKeyframesSequenceMetadata, AnimationMetadata, AnimationStateDeclarationMetadata, AnimationStateMetadata, AnimationStateTransitionMetadata, AnimationStyleMetadata, AnimationWithStepsMetadata, Attribute, ChangeDetectionStrategy, Component, Directive, Host, Inject, Injectable, ModuleWithProviders, OpaqueToken, Optional, Provider, Query, SchemaMetadata, Self, SkipSelf, Type, resolveForwardRef} from '@angular/core';
+import {AnimationAnimateMetadata, AnimationEntryMetadata, AnimationGroupMetadata, AnimationKeyframesSequenceMetadata, AnimationMetadata, AnimationStateDeclarationMetadata, AnimationStateMetadata, AnimationStateTransitionMetadata, AnimationStyleMetadata, AnimationWithStepsMetadata, Attribute, ChangeDetectionStrategy, Component, ComponentFactory, Directive, Host, Inject, Injectable, ModuleWithProviders, OpaqueToken, Optional, Provider, Query, SchemaMetadata, Self, SkipSelf, Type, resolveForwardRef} from '@angular/core';
 
-import {StaticSymbol} from './aot/static_symbol';
+import {StaticSymbol, StaticSymbolCache} from './aot/static_symbol';
+import {ngfactoryFilePath} from './aot/util';
 import {assertArrayOfStrings, assertInterpolationSymbols} from './assertions';
 import * as cpl from './compile_metadata';
 import {DirectiveNormalizer} from './directive_normalizer';
 import {DirectiveResolver} from './directive_resolver';
-import {ListWrapper, StringMapWrapper} from './facade/collection';
-import {isBlank, isPresent, stringify} from './facade/lang';
-import {Identifiers, createIdentifierToken, resolveIdentifier} from './identifiers';
+import {stringify} from './facade/lang';
+import {Identifiers, resolveIdentifier} from './identifiers';
 import {CompilerInjectable} from './injectable';
 import {hasLifecycleHook} from './lifecycle_reflector';
 import {NgModuleResolver} from './ng_module_resolver';
@@ -24,7 +24,7 @@ import {ComponentStillLoadingError, LIFECYCLE_HOOKS_VALUES, ReflectorReader, ref
 import {ElementSchemaRegistry} from './schema/element_schema_registry';
 import {SummaryResolver} from './summary_resolver';
 import {getUrlScheme} from './url_resolver';
-import {MODULE_SUFFIX, SyncAsyncResult, SyntaxError, ValueTransformer, visitValue} from './util';
+import {MODULE_SUFFIX, SyntaxError, ValueTransformer, visitValue} from './util';
 
 export type ErrorCollector = (error: any, type?: any) => void;
 export const ERROR_COLLECTOR_TOKEN = new OpaqueToken('ErrorCollector');
@@ -38,6 +38,8 @@ export const ERROR_COLLECTOR_TOKEN = new OpaqueToken('ErrorCollector');
 //   to wait correctly.
 @CompilerInjectable()
 export class CompileMetadataResolver {
+  private _nonNormalizedDirectiveCache =
+      new Map<Type<any>, {annotation: Directive, metadata: cpl.CompileDirectiveMetadata}>();
   private _directiveCache = new Map<Type<any>, cpl.CompileDirectiveMetadata>();
   private _summaryCache = new Map<Type<any>, cpl.CompileTypeSummary>();
   private _pipeCache = new Map<Type<any>, cpl.CompilePipeMetadata>();
@@ -49,12 +51,14 @@ export class CompileMetadataResolver {
       private _pipeResolver: PipeResolver, private _summaryResolver: SummaryResolver<any>,
       private _schemaRegistry: ElementSchemaRegistry,
       private _directiveNormalizer: DirectiveNormalizer,
+      @Optional() private _staticSymbolCache: StaticSymbolCache,
       private _reflector: ReflectorReader = reflector,
       @Optional() @Inject(ERROR_COLLECTOR_TOKEN) private _errorCollector?: ErrorCollector) {}
 
   clearCacheFor(type: Type<any>) {
     const dirMeta = this._directiveCache.get(type);
     this._directiveCache.delete(type);
+    this._nonNormalizedDirectiveCache.delete(type);
     this._summaryCache.delete(type);
     this._pipeCache.delete(type);
     this._ngModuleOfTypes.delete(type);
@@ -65,8 +69,9 @@ export class CompileMetadataResolver {
     }
   }
 
-  clearCache() {
+  clearCache(): void {
     this._directiveCache.clear();
+    this._nonNormalizedDirectiveCache.clear();
     this._summaryCache.clear();
     this._pipeCache.clear();
     this._ngModuleCache.clear();
@@ -74,6 +79,66 @@ export class CompileMetadataResolver {
     this._directiveNormalizer.clearCache();
   }
 
+  private _createProxyClass(baseType: any, name: string): cpl.ProxyClass {
+    let delegate: any = null;
+    const proxyClass: cpl.ProxyClass = <any>function() {
+      if (!delegate) {
+        throw new Error(
+            `Illegal state: Class ${name} for type ${stringify(baseType)} is not compiled yet!`);
+      }
+      return delegate.apply(this, arguments);
+    };
+    proxyClass.setDelegate = (d) => {
+      delegate = d;
+      (<any>proxyClass).prototype = d.prototype;
+    };
+    // Make stringify work correctly
+    (<any>proxyClass).overriddenName = name;
+    return proxyClass;
+  }
+
+  private getGeneratedClass(dirType: any, name: string): StaticSymbol|cpl.ProxyClass {
+    if (dirType instanceof StaticSymbol) {
+      return this._staticSymbolCache.get(ngfactoryFilePath(dirType.filePath), name);
+    } else {
+      return this._createProxyClass(dirType, name);
+    }
+  }
+
+  private getDirectiveWrapperClass(dirType: any): StaticSymbol|cpl.ProxyClass {
+    return this.getGeneratedClass(dirType, cpl.dirWrapperClassName(dirType));
+  }
+
+  private getComponentViewClass(dirType: any): StaticSymbol|cpl.ProxyClass {
+    return this.getGeneratedClass(dirType, cpl.viewClassName(dirType, 0));
+  }
+
+  getHostComponentViewClass(dirType: any): StaticSymbol|cpl.ProxyClass {
+    return this.getGeneratedClass(dirType, cpl.hostViewClassName(dirType));
+  }
+
+  getHostComponentType(dirType: any): StaticSymbol|Type<any> {
+    const name = `${cpl.identifierName({reference: dirType})}_Host`;
+    if (dirType instanceof StaticSymbol) {
+      return this._staticSymbolCache.get(dirType.filePath, name);
+    } else {
+      const HostClass = <any>function HostClass() {};
+      HostClass.overriddenName = name;
+
+      return HostClass;
+    }
+  }
+
+  private getComponentFactory(selector: string, dirType: any): StaticSymbol|ComponentFactory<any> {
+    if (dirType instanceof StaticSymbol) {
+      return this._staticSymbolCache.get(
+          ngfactoryFilePath(dirType.filePath), cpl.componentFactoryName(dirType));
+    } else {
+      const hostView = this.getHostComponentViewClass(dirType);
+      return new ComponentFactory(selector, <any>hostView, dirType);
+    }
+  }
+
   getAnimationEntryMetadata(entry: AnimationEntryMetadata): cpl.CompileAnimationEntryMetadata {
     const defs = entry.definitions.map(def => this._getAnimationStateMetadata(def));
     return new cpl.CompileAnimationEntryMetadata(entry.name, defs);
@@ -162,6 +227,9 @@ export class CompileMetadataResolver {
         queries: metadata.queries,
         viewQueries: metadata.viewQueries,
         entryComponents: metadata.entryComponents,
+        wrapperType: metadata.wrapperType,
+        componentViewType: metadata.componentViewType,
+        componentFactory: metadata.componentFactory,
         template: templateMetadata
       });
       this._directiveCache.set(directiveType, normalizedDirMeta);
@@ -201,7 +269,14 @@ export class CompileMetadataResolver {
   getNonNormalizedDirectiveMetadata(directiveType: any):
       {annotation: Directive, metadata: cpl.CompileDirectiveMetadata} {
     directiveType = resolveForwardRef(directiveType);
-    const dirMeta = this._directiveResolver.resolve(directiveType);
+    if (!directiveType) {
+      return null;
+    }
+    let cacheEntry = this._nonNormalizedDirectiveCache.get(directiveType);
+    if (cacheEntry) {
+      return cacheEntry;
+    }
+    const dirMeta = this._directiveResolver.resolve(directiveType, false);
     if (!dirMeta) {
       return null;
     }
@@ -230,7 +305,7 @@ export class CompileMetadataResolver {
 
     let changeDetectionStrategy: ChangeDetectionStrategy = null;
     let viewProviders: cpl.CompileProviderMetadata[] = [];
-    let entryComponentMetadata: cpl.CompileIdentifierMetadata[] = [];
+    let entryComponentMetadata: cpl.CompileEntryComponentMetadata[] = [];
     let selector = dirMeta.selector;
 
     if (dirMeta instanceof Component) {
@@ -243,7 +318,7 @@ export class CompileMetadataResolver {
       }
       if (dirMeta.entryComponents) {
         entryComponentMetadata = flattenAndDedupeArray(dirMeta.entryComponents)
-                                     .map((type) => this._getIdentifierMetadata(type))
+                                     .map((type) => this._getEntryComponentMetadata(type))
                                      .concat(entryComponentMetadata);
       }
       if (!selector) {
@@ -261,14 +336,14 @@ export class CompileMetadataResolver {
     }
 
     let providers: cpl.CompileProviderMetadata[] = [];
-    if (isPresent(dirMeta.providers)) {
+    if (dirMeta.providers != null) {
       providers = this._getProvidersMetadata(
           dirMeta.providers, entryComponentMetadata,
           `providers for "${stringifyType(directiveType)}"`, [], directiveType);
     }
     let queries: cpl.CompileQueryMetadata[] = [];
     let viewQueries: cpl.CompileQueryMetadata[] = [];
-    if (isPresent(dirMeta.queries)) {
+    if (dirMeta.queries != null) {
       queries = this._getQueriesMetadata(dirMeta.queries, false, directiveType);
       viewQueries = this._getQueriesMetadata(dirMeta.queries, true, directiveType);
     }
@@ -287,9 +362,17 @@ export class CompileMetadataResolver {
       viewProviders: viewProviders,
       queries: queries,
       viewQueries: viewQueries,
-      entryComponents: entryComponentMetadata
+      entryComponents: entryComponentMetadata,
+      wrapperType: this.getDirectiveWrapperClass(directiveType),
+      componentViewType: nonNormalizedTemplateMetadata ? this.getComponentViewClass(directiveType) :
+                                                         undefined,
+      componentFactory: nonNormalizedTemplateMetadata ?
+          this.getComponentFactory(selector, directiveType) :
+          undefined
     });
-    return {metadata, annotation: dirMeta};
+    cacheEntry = {metadata, annotation: dirMeta};
+    this._nonNormalizedDirectiveCache.set(directiveType, cacheEntry);
+    return cacheEntry;
   }
 
   /**
@@ -371,7 +454,7 @@ export class CompileMetadataResolver {
     const importedModules: cpl.CompileNgModuleSummary[] = [];
     const exportedModules: cpl.CompileNgModuleSummary[] = [];
     const providers: cpl.CompileProviderMetadata[] = [];
-    const entryComponents: cpl.CompileIdentifierMetadata[] = [];
+    const entryComponents: cpl.CompileEntryComponentMetadata[] = [];
     const bootstrapComponents: cpl.CompileIdentifierMetadata[] = [];
     const schemas: SchemaMetadata[] = [];
 
@@ -488,7 +571,7 @@ export class CompileMetadataResolver {
 
     if (meta.entryComponents) {
       entryComponents.push(...flattenAndDedupeArray(meta.entryComponents)
-                               .map(type => this._getIdentifierMetadata(type)));
+                               .map(type => this._getEntryComponentMetadata(type)));
     }
 
     if (meta.bootstrap) {
@@ -504,7 +587,8 @@ export class CompileMetadataResolver {
       });
     }
 
-    entryComponents.push(...bootstrapComponents);
+    entryComponents.push(
+        ...bootstrapComponents.map(type => this._getEntryComponentMetadata(type.reference)));
 
     if (meta.schemas) {
       schemas.push(...flattenAndDedupeArray(meta.schemas));
@@ -722,14 +806,14 @@ export class CompileMetadataResolver {
             token = paramEntry.attributeName;
           } else if (paramEntry instanceof Inject) {
             token = paramEntry.token;
-          } else if (isValidType(paramEntry) && isBlank(token)) {
+          } else if (isValidType(paramEntry) && token == null) {
             token = paramEntry;
           }
         });
       } else {
         token = param;
       }
-      if (isBlank(token)) {
+      if (token == null) {
         hasUnknownDeps = true;
         return null;
       }
@@ -769,7 +853,7 @@ export class CompileMetadataResolver {
   }
 
   private _getProvidersMetadata(
-      providers: Provider[], targetEntryComponents: cpl.CompileIdentifierMetadata[],
+      providers: Provider[], targetEntryComponents: cpl.CompileEntryComponentMetadata[],
       debugInfo?: string, compileProviders: cpl.CompileProviderMetadata[] = [],
       type?: any): cpl.CompileProviderMetadata[] {
     providers.forEach((provider: any, providerIdx: number) => {
@@ -778,10 +862,14 @@ export class CompileMetadataResolver {
       } else {
         provider = resolveForwardRef(provider);
         let providerMeta: cpl.ProviderMeta;
-        if (provider && typeof provider == 'object' && provider.hasOwnProperty('provide')) {
+        if (provider && typeof provider === 'object' && provider.hasOwnProperty('provide')) {
+          this._validateProvider(provider);
           providerMeta = new cpl.ProviderMeta(provider.provide, provider);
         } else if (isValidType(provider)) {
           providerMeta = new cpl.ProviderMeta(provider, {useClass: provider});
+        } else if (provider === void 0) {
+          this._reportError(new SyntaxError(
+              `Encountered undefined provider! Usually this means you have a circular dependencies (might be caused by using 'barrel' index.ts files.`));
         } else {
           const providersInfo =
               (<string[]>providers.reduce(
@@ -812,9 +900,19 @@ export class CompileMetadataResolver {
     return compileProviders;
   }
 
+  private _validateProvider(provider: any): void {
+    if (provider.hasOwnProperty('useClass') && provider.useClass == null) {
+      this._reportError(new SyntaxError(
+          `Invalid provider for ${stringifyType(provider.provide)}. useClass cannot be ${provider.useClass}.
+           Usually it happens when:
+           1. There's a circular dependency (might be caused by using index.ts (barrel) files).
+           2. Class was used before it was declared. Use forwardRef in this case.`));
+    }
+  }
+
   private _getEntryComponentsFromProvider(provider: cpl.ProviderMeta, type?: any):
-      cpl.CompileIdentifierMetadata[] {
-    const components: cpl.CompileIdentifierMetadata[] = [];
+      cpl.CompileEntryComponentMetadata[] {
+    const components: cpl.CompileEntryComponentMetadata[] = [];
     const collectedIdentifiers: cpl.CompileIdentifierMetadata[] = [];
 
     if (provider.useFactory || provider.useExisting || provider.useClass) {
@@ -832,14 +930,27 @@ export class CompileMetadataResolver {
 
     extractIdentifiers(provider.useValue, collectedIdentifiers);
     collectedIdentifiers.forEach((identifier) => {
-      if (this._directiveResolver.isDirective(identifier.reference) ||
-          this._loadSummary(identifier.reference, cpl.CompileSummaryKind.Directive)) {
-        components.push(identifier);
+      const entry = this._getEntryComponentMetadata(identifier.reference);
+      if (entry) {
+        components.push(entry);
       }
     });
     return components;
   }
 
+  private _getEntryComponentMetadata(dirType: any): cpl.CompileEntryComponentMetadata {
+    const dirMeta = this.getNonNormalizedDirectiveMetadata(dirType);
+    if (dirMeta) {
+      return {componentType: dirType, componentFactory: dirMeta.metadata.componentFactory};
+    } else {
+      const dirSummary =
+          <cpl.CompileDirectiveSummary>this._loadSummary(dirType, cpl.CompileSummaryKind.Directive);
+      if (dirSummary) {
+        return {componentType: dirType, componentFactory: dirSummary.componentFactory};
+      }
+    }
+  }
+
   getProviderMetadata(provider: cpl.ProviderMeta): cpl.CompileProviderMetadata {
     let compileDeps: cpl.CompileDiDependencyMetadata[];
     let compileTypeMetadata: cpl.CompileTypeMetadata = null;

modules/@angular/compiler/src/ml_parser/parser.ts

@@ -283,7 +283,7 @@ class _TreeBuilder {
     const tagDef = this.getTagDefinition(el.name);
     const {parent, container} = this._getParentElementSkippingContainers();
 
-    if (isPresent(parent) && tagDef.requireExtraParent(parent.name)) {
+    if (parent && tagDef.requireExtraParent(parent.name)) {
       const newParent = new html.Element(
           tagDef.parentToAdd, [], [], el.sourceSpan, el.startSourceSpan, el.endSourceSpan);
       this._insertBeforeContainer(parent, container, newParent);

modules/@angular/compiler/src/ng_module_compiler.ts

@@ -9,7 +9,7 @@
 import {CompileDiDependencyMetadata, CompileIdentifierMetadata, CompileNgModuleMetadata, CompileProviderMetadata, CompileTokenMetadata, identifierModuleUrl, identifierName, tokenName, tokenReference} from './compile_metadata';
 import {createDiTokenExpression} from './compiler_util/identifier_util';
 import {isPresent} from './facade/lang';
-import {Identifiers, createIdentifier, createIdentifierToken, resolveIdentifier} from './identifiers';
+import {Identifiers, createIdentifier, resolveIdentifier} from './identifiers';
 import {CompilerInjectable} from './injectable';
 import {ClassBuilder, createClassStmt} from './output/class_builder';
 import * as o from './output/output_ast';
@@ -19,9 +19,12 @@ import {LifecycleHooks} from './private_import_core';
 import {NgModuleProviderAnalyzer} from './provider_analyzer';
 import {ProviderAst} from './template_parser/template_ast';
 
+/**
+ * This is currently not read, but will probably be used in the future.
+ * We keep it as we already pass it through all the rigth places...
+ */
 export class ComponentFactoryDependency {
-  constructor(
-      public comp: CompileIdentifierMetadata, public placeholder: CompileIdentifierMetadata) {}
+  constructor(public compType: any) {}
 }
 
 export class NgModuleCompileResult {
@@ -46,13 +49,12 @@ export class NgModuleCompiler {
     const bootstrapComponentFactories: CompileIdentifierMetadata[] = [];
     const entryComponentFactories =
         ngModuleMeta.transitiveModule.entryComponents.map((entryComponent) => {
-          const id: CompileIdentifierMetadata = {reference: null};
           if (ngModuleMeta.bootstrapComponents.some(
-                  (id) => id.reference === entryComponent.reference)) {
-            bootstrapComponentFactories.push(id);
+                  (id) => id.reference === entryComponent.componentType)) {
+            bootstrapComponentFactories.push({reference: entryComponent.componentFactory});
           }
-          deps.push(new ComponentFactoryDependency(entryComponent, id));
-          return id;
+          deps.push(new ComponentFactoryDependency(entryComponent.componentType));
+          return {reference: entryComponent.componentFactory};
         });
     const builder = new _InjectorBuilder(
         ngModuleMeta, entryComponentFactories, bootstrapComponentFactories, sourceSpan);

modules/@angular/compiler/src/ng_module_resolver.ts

@@ -9,7 +9,7 @@
 import {NgModule, Type} from '@angular/core';
 
 import {ListWrapper} from './facade/collection';
-import {isPresent, stringify} from './facade/lang';
+import {stringify} from './facade/lang';
 import {CompilerInjectable} from './injectable';
 import {ReflectorReader, reflector} from './private_import_core';
 
@@ -30,7 +30,7 @@ export class NgModuleResolver {
     const ngModuleMeta: NgModule =
         ListWrapper.findLast(this._reflector.annotations(type), _isNgModuleMetadata);
 
-    if (isPresent(ngModuleMeta)) {
+    if (ngModuleMeta) {
       return ngModuleMeta;
     } else {
       if (throwIfNotFound) {

modules/@angular/compiler/src/output/js_emitter.ts

@@ -7,8 +7,9 @@
  */
 
 
-import {identifierModuleUrl, identifierName} from '../compile_metadata';
-import {isBlank, isPresent} from '../facade/lang';
+import {StaticSymbol} from '../aot/static_symbol';
+import {CompileIdentifierMetadata} from '../compile_metadata';
+import {isBlank} from '../facade/lang';
 
 import {EmitterVisitorContext, OutputEmitter} from './abstract_emitter';
 import {AbstractJsEmitterVisitor} from './abstract_js_emitter';
@@ -16,17 +17,17 @@ import * as o from './output_ast';
 import {ImportResolver} from './path_util';
 
 export class JavaScriptEmitter implements OutputEmitter {
-  constructor(private _importGenerator: ImportResolver) {}
-  emitStatements(moduleUrl: string, stmts: o.Statement[], exportedVars: string[]): string {
-    const converter = new JsEmitterVisitor(moduleUrl);
+  constructor(private _importResolver: ImportResolver) {}
+  emitStatements(genFilePath: string, stmts: o.Statement[], exportedVars: string[]): string {
+    const converter = new JsEmitterVisitor(genFilePath, this._importResolver);
     const ctx = EmitterVisitorContext.createRoot(exportedVars);
     converter.visitAllStatements(stmts, ctx);
     const srcParts: string[] = [];
-    converter.importsWithPrefixes.forEach((prefix, importedModuleUrl) => {
+    converter.importsWithPrefixes.forEach((prefix, importedFilePath) => {
       // Note: can't write the real word for import as it screws up system.js auto detection...
       srcParts.push(
           `var ${prefix} = req` +
-          `uire('${this._importGenerator.fileNameToModuleName(importedModuleUrl, moduleUrl)}');`);
+          `uire('${this._importResolver.fileNameToModuleName(importedFilePath, genFilePath)}');`);
     });
     srcParts.push(ctx.toSource());
     return srcParts.join('\n');
@@ -36,20 +37,23 @@ export class JavaScriptEmitter implements OutputEmitter {
 class JsEmitterVisitor extends AbstractJsEmitterVisitor {
   importsWithPrefixes = new Map<string, string>();
 
-  constructor(private _moduleUrl: string) { super(); }
+  constructor(private _genFilePath: string, private _importResolver: ImportResolver) { super(); }
+
+  private _resolveStaticSymbol(value: CompileIdentifierMetadata): StaticSymbol {
+    const reference = value.reference;
+    if (!(reference instanceof StaticSymbol)) {
+      throw new Error(`Internal error: unknown identifier ${JSON.stringify(value)}`);
+    }
+    return this._importResolver.getImportAs(reference) || reference;
+  }
 
   visitExternalExpr(ast: o.ExternalExpr, ctx: EmitterVisitorContext): any {
-    const name = identifierName(ast.value);
-    const moduleUrl = identifierModuleUrl(ast.value);
-    if (isBlank(name)) {
-      console.error('>>>', ast.value);
-      throw new Error(`Internal error: unknown identifier ${ast.value}`);
-    }
-    if (isPresent(moduleUrl) && moduleUrl != this._moduleUrl) {
-      let prefix = this.importsWithPrefixes.get(moduleUrl);
+    const {name, filePath} = this._resolveStaticSymbol(ast.value);
+    if (filePath != this._genFilePath) {
+      let prefix = this.importsWithPrefixes.get(filePath);
       if (isBlank(prefix)) {
         prefix = `import${this.importsWithPrefixes.size}`;
-        this.importsWithPrefixes.set(moduleUrl, prefix);
+        this.importsWithPrefixes.set(filePath, prefix);
       }
       ctx.print(`${prefix}.`);
     }

modules/@angular/compiler/src/output/output_ast.ts

@@ -68,13 +68,13 @@ export class MapType extends Type {
   visitType(visitor: TypeVisitor, context: any): any { return visitor.visitMapType(this, context); }
 }
 
-export var DYNAMIC_TYPE = new BuiltinType(BuiltinTypeName.Dynamic);
-export var BOOL_TYPE = new BuiltinType(BuiltinTypeName.Bool);
-export var INT_TYPE = new BuiltinType(BuiltinTypeName.Int);
-export var NUMBER_TYPE = new BuiltinType(BuiltinTypeName.Number);
-export var STRING_TYPE = new BuiltinType(BuiltinTypeName.String);
-export var FUNCTION_TYPE = new BuiltinType(BuiltinTypeName.Function);
-export var NULL_TYPE = new BuiltinType(BuiltinTypeName.Null);
+export const DYNAMIC_TYPE = new BuiltinType(BuiltinTypeName.Dynamic);
+export const BOOL_TYPE = new BuiltinType(BuiltinTypeName.Bool);
+export const INT_TYPE = new BuiltinType(BuiltinTypeName.Int);
+export const NUMBER_TYPE = new BuiltinType(BuiltinTypeName.Number);
+export const STRING_TYPE = new BuiltinType(BuiltinTypeName.String);
+export const FUNCTION_TYPE = new BuiltinType(BuiltinTypeName.Function);
+export const NULL_TYPE = new BuiltinType(BuiltinTypeName.Null);
 
 export interface TypeVisitor {
   visitBuiltintType(type: BuiltinType, context: any): any;
@@ -451,12 +451,12 @@ export interface ExpressionVisitor {
   visitLiteralMapExpr(ast: LiteralMapExpr, context: any): any;
 }
 
-export var THIS_EXPR = new ReadVarExpr(BuiltinVar.This);
-export var SUPER_EXPR = new ReadVarExpr(BuiltinVar.Super);
-export var CATCH_ERROR_VAR = new ReadVarExpr(BuiltinVar.CatchError);
-export var CATCH_STACK_VAR = new ReadVarExpr(BuiltinVar.CatchStack);
-export var NULL_EXPR = new LiteralExpr(null, null);
-export var TYPED_NULL_EXPR = new LiteralExpr(null, NULL_TYPE);
+export const THIS_EXPR = new ReadVarExpr(BuiltinVar.This);
+export const SUPER_EXPR = new ReadVarExpr(BuiltinVar.Super);
+export const CATCH_ERROR_VAR = new ReadVarExpr(BuiltinVar.CatchError);
+export const CATCH_STACK_VAR = new ReadVarExpr(BuiltinVar.CatchStack);
+export const NULL_EXPR = new LiteralExpr(null, null);
+export const TYPED_NULL_EXPR = new LiteralExpr(null, NULL_TYPE);
 
 //// Statements
 export enum StmtModifier {

modules/@angular/compiler/src/output/path_util.ts

@@ -6,6 +6,8 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import {StaticSymbol} from '../aot/static_symbol';
+
 /**
  * Interface that defines how import statements should be generated.
  */
@@ -16,4 +18,10 @@ export abstract class ImportResolver {
    */
   abstract fileNameToModuleName(importedFilePath: string, containingFilePath: string): string
       /*|null*/;
+
+  /**
+   * Converts the given StaticSymbol into another StaticSymbol that should be used
+   * to generate the import from.
+   */
+  abstract getImportAs(symbol: StaticSymbol): StaticSymbol /*|null*/;
 }

modules/@angular/compiler/src/output/ts_emitter.ts

@@ -7,18 +7,22 @@
  */
 
 
-import {CompileIdentifierMetadata, identifierModuleUrl, identifierName} from '../compile_metadata';
+import {StaticSymbol} from '../aot/static_symbol';
+import {CompileIdentifierMetadata} from '../compile_metadata';
 import {isBlank, isPresent} from '../facade/lang';
 
 import {AbstractEmitterVisitor, CATCH_ERROR_VAR, CATCH_STACK_VAR, EmitterVisitorContext, OutputEmitter} from './abstract_emitter';
 import * as o from './output_ast';
 import {ImportResolver} from './path_util';
 
-const _debugModuleUrl = '/debug/lib';
+const _debugFilePath = '/debug/lib';
 
 export function debugOutputAstAsTypeScript(ast: o.Statement | o.Expression | o.Type | any[]):
     string {
-  const converter = new _TsEmitterVisitor(_debugModuleUrl);
+  const converter = new _TsEmitterVisitor(_debugFilePath, {
+    fileNameToModuleName(filePath: string, containingFilePath: string) { return filePath; },
+    getImportAs(symbol: StaticSymbol) { return null; }
+  });
   const ctx = EmitterVisitorContext.createRoot([]);
   const asts: any[] = Array.isArray(ast) ? ast : [ast];
 
@@ -37,17 +41,23 @@ export function debugOutputAstAsTypeScript(ast: o.Statement | o.Expression | o.T
 }
 
 export class TypeScriptEmitter implements OutputEmitter {
-  constructor(private _importGenerator: ImportResolver) {}
-  emitStatements(moduleUrl: string, stmts: o.Statement[], exportedVars: string[]): string {
-    const converter = new _TsEmitterVisitor(moduleUrl);
+  constructor(private _importResolver: ImportResolver) {}
+  emitStatements(genFilePath: string, stmts: o.Statement[], exportedVars: string[]): string {
+    const converter = new _TsEmitterVisitor(genFilePath, this._importResolver);
     const ctx = EmitterVisitorContext.createRoot(exportedVars);
     converter.visitAllStatements(stmts, ctx);
     const srcParts: string[] = [];
-    converter.importsWithPrefixes.forEach((prefix, importedModuleUrl) => {
+    converter.reexports.forEach((reexports, exportedFilePath) => {
+      const reexportsCode =
+          reexports.map(reexport => `${reexport.name} as ${reexport.as}`).join(',');
+      srcParts.push(
+          `export {${reexportsCode}} from '${this._importResolver.fileNameToModuleName(exportedFilePath, genFilePath)}';`);
+    });
+    converter.importsWithPrefixes.forEach((prefix, importedFilePath) => {
       // Note: can't write the real word for import as it screws up system.js auto detection...
       srcParts.push(
           `imp` +
-          `ort * as ${prefix} from '${this._importGenerator.fileNameToModuleName(importedModuleUrl, moduleUrl)}';`);
+          `ort * as ${prefix} from '${this._importResolver.fileNameToModuleName(importedFilePath, genFilePath)}';`);
     });
     srcParts.push(ctx.toSource());
     return srcParts.join('\n');
@@ -55,9 +65,12 @@ export class TypeScriptEmitter implements OutputEmitter {
 }
 
 class _TsEmitterVisitor extends AbstractEmitterVisitor implements o.TypeVisitor {
-  constructor(private _moduleUrl: string) { super(false); }
+  constructor(private _genFilePath: string, private _importResolver: ImportResolver) {
+    super(false);
+  }
 
   importsWithPrefixes = new Map<string, string>();
+  reexports = new Map<string, {name: string, as: string}[]>();
 
   visitType(t: o.Type, ctx: EmitterVisitorContext, defaultType: string = 'any') {
     if (isPresent(t)) {
@@ -98,6 +111,19 @@ class _TsEmitterVisitor extends AbstractEmitterVisitor implements o.TypeVisitor
   }
 
   visitDeclareVarStmt(stmt: o.DeclareVarStmt, ctx: EmitterVisitorContext): any {
+    if (ctx.isExportedVar(stmt.name) && stmt.value instanceof o.ExternalExpr && !stmt.type) {
+      // check for a reexport
+      const {name, filePath, members} = this._resolveStaticSymbol(stmt.value.value);
+      if (members.length === 0 && filePath !== this._genFilePath) {
+        let reexports = this.reexports.get(filePath);
+        if (!reexports) {
+          reexports = [];
+          this.reexports.set(filePath, reexports);
+        }
+        reexports.push({name, as: stmt.name});
+        return null;
+      }
+    }
     if (ctx.isExportedVar(stmt.name)) {
       ctx.print(`export `);
     }
@@ -320,25 +346,29 @@ class _TsEmitterVisitor extends AbstractEmitterVisitor implements o.TypeVisitor
     }, params, ctx, ',');
   }
 
+  private _resolveStaticSymbol(value: CompileIdentifierMetadata): StaticSymbol {
+    const reference = value.reference;
+    if (!(reference instanceof StaticSymbol)) {
+      throw new Error(`Internal error: unknown identifier ${JSON.stringify(value)}`);
+    }
+    return this._importResolver.getImportAs(reference) || reference;
+  }
+
   private _visitIdentifier(
       value: CompileIdentifierMetadata, typeParams: o.Type[], ctx: EmitterVisitorContext): void {
-    const name = identifierName(value);
-    const moduleUrl = identifierModuleUrl(value);
-    if (isBlank(name)) {
-      throw new Error(`Internal error: unknown identifier ${value}`);
-    }
-    if (isPresent(moduleUrl) && moduleUrl != this._moduleUrl) {
-      let prefix = this.importsWithPrefixes.get(moduleUrl);
+    const {name, filePath, members} = this._resolveStaticSymbol(value);
+    if (filePath != this._genFilePath) {
+      let prefix = this.importsWithPrefixes.get(filePath);
       if (isBlank(prefix)) {
         prefix = `import${this.importsWithPrefixes.size}`;
-        this.importsWithPrefixes.set(moduleUrl, prefix);
+        this.importsWithPrefixes.set(filePath, prefix);
       }
       ctx.print(`${prefix}.`);
     }
-    if (value.reference && value.reference.members && value.reference.members.length) {
-      ctx.print(value.reference.name);
+    if (members.length) {
+      ctx.print(name);
       ctx.print('.');
-      ctx.print(value.reference.members.join('.'));
+      ctx.print(members.join('.'));
     } else {
       ctx.print(name);
     }

modules/@angular/compiler/src/output/value_util.ts

@@ -7,7 +7,6 @@
  */
 
 
-import {CompileIdentifierMetadata} from '../compile_metadata';
 import {ValueTransformer, visitValue} from '../util';
 
 import * as o from './output_ast';

modules/@angular/compiler/src/pipe_resolver.ts

@@ -9,7 +9,7 @@
 import {Pipe, Type, resolveForwardRef} from '@angular/core';
 
 import {ListWrapper} from './facade/collection';
-import {isPresent, stringify} from './facade/lang';
+import {stringify} from './facade/lang';
 import {CompilerInjectable} from './injectable';
 import {ReflectorReader, reflector} from './private_import_core';
 
@@ -38,9 +38,9 @@ export class PipeResolver {
    */
   resolve(type: Type<any>, throwIfNotFound = true): Pipe {
     const metas = this._reflector.annotations(resolveForwardRef(type));
-    if (isPresent(metas)) {
+    if (metas) {
       const annotation = ListWrapper.findLast(metas, _isPipeMetadata);
-      if (isPresent(annotation)) {
+      if (annotation) {
         return annotation;
       }
     }

modules/@angular/compiler/src/private_import_core.ts

@@ -32,7 +32,6 @@ export const view_utils: typeof r.view_utils = r.view_utils;
 export const DebugContext: typeof r.DebugContext = r.DebugContext;
 export const StaticNodeDebugInfo: typeof r.StaticNodeDebugInfo = r.StaticNodeDebugInfo;
 export const devModeEqual: typeof r.devModeEqual = r.devModeEqual;
-export const UNINITIALIZED: typeof r.UNINITIALIZED = r.UNINITIALIZED;
 export const ValueUnwrapper: typeof r.ValueUnwrapper = r.ValueUnwrapper;
 export const TemplateRef_: typeof r.TemplateRef_ = r.TemplateRef_;
 export type RenderDebugInfo = typeof r._RenderDebugInfo;

modules/@angular/compiler/src/provider_analyzer.ts

@@ -9,7 +9,7 @@
 
 import {CompileDiDependencyMetadata, CompileDirectiveMetadata, CompileDirectiveSummary, CompileNgModuleMetadata, CompileProviderMetadata, CompileQueryMetadata, CompileTokenMetadata, CompileTypeMetadata, tokenName, tokenReference} from './compile_metadata';
 import {isBlank, isPresent} from './facade/lang';
-import {Identifiers, createIdentifierToken, resolveIdentifier} from './identifiers';
+import {Identifiers, resolveIdentifier} from './identifiers';
 import {ParseError, ParseSourceSpan} from './parse_util';
 import {AttrAst, DirectiveAst, ProviderAst, ProviderAstType, ReferenceAst} from './template_parser/template_ast';
 
@@ -114,7 +114,7 @@ export class ProviderElementContext {
     let queries: CompileQueryMetadata[];
     while (currentEl !== null) {
       queries = currentEl._contentQueries.get(tokenReference(token));
-      if (isPresent(queries)) {
+      if (queries) {
         result.push(...queries.filter((query) => query.descendants || distance <= 1));
       }
       if (currentEl._directiveAsts.length > 0) {
@@ -123,7 +123,7 @@ export class ProviderElementContext {
       currentEl = currentEl._parent;
     }
     queries = this.viewContext.viewQueries.get(tokenReference(token));
-    if (isPresent(queries)) {
+    if (queries) {
       result.push(...queries);
     }
     return result;
@@ -143,7 +143,7 @@ export class ProviderElementContext {
       return null;
     }
     let transformedProviderAst = this._transformedProviders.get(tokenReference(token));
-    if (isPresent(transformedProviderAst)) {
+    if (transformedProviderAst) {
       return transformedProviderAst;
     }
     if (isPresent(this._seenProviders.get(tokenReference(token)))) {
@@ -165,11 +165,11 @@ export class ProviderElementContext {
           transformedUseExisting = null;
           transformedUseValue = existingDiDep.value;
         }
-      } else if (isPresent(provider.useFactory)) {
+      } else if (provider.useFactory) {
         const deps = provider.deps || provider.useFactory.diDeps;
         transformedDeps =
             deps.map((dep) => this._getDependency(resolvedProvider.providerType, dep, eager));
-      } else if (isPresent(provider.useClass)) {
+      } else if (provider.useClass) {
         const deps = provider.deps || provider.useClass.diDeps;
         transformedDeps =
             deps.map((dep) => this._getDependency(resolvedProvider.providerType, dep, eager));
@@ -235,7 +235,7 @@ export class ProviderElementContext {
       }
     } else {
       // check parent elements
-      while (!result && isPresent(currElement._parent)) {
+      while (!result && currElement._parent) {
         const prevElement = currElement;
         currElement = currElement._parent;
         if (prevElement._isViewRoot) {
@@ -301,7 +301,7 @@ export class NgModuleProviderAnalyzer {
       return null;
     }
     let transformedProviderAst = this._transformedProviders.get(tokenReference(token));
-    if (isPresent(transformedProviderAst)) {
+    if (transformedProviderAst) {
       return transformedProviderAst;
     }
     if (isPresent(this._seenProviders.get(tokenReference(token)))) {
@@ -324,11 +324,11 @@ export class NgModuleProviderAnalyzer {
           transformedUseExisting = null;
           transformedUseValue = existingDiDep.value;
         }
-      } else if (isPresent(provider.useFactory)) {
+      } else if (provider.useFactory) {
         const deps = provider.deps || provider.useFactory.diDeps;
         transformedDeps =
             deps.map((dep) => this._getDependency(dep, eager, resolvedProvider.sourceSpan));
-      } else if (isPresent(provider.useClass)) {
+      } else if (provider.useClass) {
         const deps = provider.deps || provider.useClass.diDeps;
         transformedDeps =
             deps.map((dep) => this._getDependency(dep, eager, resolvedProvider.sourceSpan));
@@ -454,7 +454,7 @@ function _resolveProviders(
 
 function _getViewQueries(component: CompileDirectiveMetadata): Map<any, CompileQueryMetadata[]> {
   const viewQueries = new Map<any, CompileQueryMetadata[]>();
-  if (isPresent(component.viewQueries)) {
+  if (component.viewQueries) {
     component.viewQueries.forEach((query) => _addQueryToTokenMap(viewQueries, query));
   }
   return viewQueries;
@@ -464,7 +464,7 @@ function _getContentQueries(directives: CompileDirectiveSummary[]):
     Map<any, CompileQueryMetadata[]> {
   const contentQueries = new Map<any, CompileQueryMetadata[]>();
   directives.forEach(directive => {
-    if (isPresent(directive.queries)) {
+    if (directive.queries) {
       directive.queries.forEach((query) => _addQueryToTokenMap(contentQueries, query));
     }
   });

modules/@angular/compiler/src/selector.ts

@@ -9,12 +9,12 @@
 import {getHtmlTagDefinition} from './ml_parser/html_tags';
 
 const _SELECTOR_REGEXP = new RegExp(
-    '(\\:not\\()|' +                              //":not("
-        '([-\\w]+)|' +                            // "tag"
-        '(?:\\.([-\\w]+))|' +                     // ".class"
-        '(?:\\[([-\\w*]+)(?:=([^\\]]*))?\\])|' +  // "[name]", "[name=value]"
-        '(\\))|' +                                // ")"
-        '(\\s*,\\s*)',                            // ","
+    '(\\:not\\()|' +                               //":not("
+        '([-\\w]+)|' +                             // "tag"
+        '(?:\\.([-\\w]+))|' +                      // ".class"
+        '(?:\\[([.-\\w*]+)(?:=([^\\]]*))?\\])|' +  // "[name]", "[name=value]"
+        '(\\))|' +                                 // ")"
+        '(\\s*,\\s*)',                             // ","
     'g');
 
 /**

modules/@angular/compiler/src/summary_resolver.ts

@@ -16,6 +16,9 @@ export interface Summary<T> {
 
 @CompilerInjectable()
 export class SummaryResolver<T> {
+  isLibraryFile(fileName: string): boolean { return false; };
+  getLibraryFileName(fileName: string): string { return null; }
   resolveSummary(reference: T): Summary<T> { return null; };
   getSymbolsOf(filePath: string): T[] { return []; }
+  getImportAs(reference: T): T { return reference; }
 }

modules/@angular/compiler/src/template_parser/binding_parser.ts

@@ -11,7 +11,6 @@ import {SecurityContext} from '@angular/core';
 import {CompileDirectiveSummary, CompilePipeSummary} from '../compile_metadata';
 import {ASTWithSource, BindingPipe, EmptyExpr, ParserError, RecursiveAstVisitor, TemplateBinding} from '../expression_parser/ast';
 import {Parser} from '../expression_parser/parser';
-import {isPresent} from '../facade/lang';
 import {InterpolationConfig} from '../ml_parser/interpolation_config';
 import {mergeNsAndName} from '../ml_parser/tags';
 import {ParseError, ParseErrorLevel, ParseSourceSpan} from '../parse_util';
@@ -111,14 +110,14 @@ export class BindingParser {
   }
 
   parseInlineTemplateBinding(
-      name: string, prefixToken: string, value: string, sourceSpan: ParseSourceSpan,
+      prefixToken: string, value: string, sourceSpan: ParseSourceSpan,
       targetMatchableAttrs: string[][], targetProps: BoundProperty[], targetVars: VariableAst[]) {
     const bindings = this._parseTemplateBindings(prefixToken, value, sourceSpan);
     for (let i = 0; i < bindings.length; i++) {
       const binding = bindings[i];
       if (binding.keyIsVar) {
         targetVars.push(new VariableAst(binding.key, binding.name, sourceSpan));
-      } else if (isPresent(binding.expression)) {
+      } else if (binding.expression) {
         this._parsePropertyAst(
             binding.key, binding.expression, sourceSpan, targetMatchableAttrs, targetProps);
       } else {
@@ -136,7 +135,7 @@ export class BindingParser {
       const bindingsResult = this._exprParser.parseTemplateBindings(prefixToken, value, sourceInfo);
       this._reportExpressionParserErrors(bindingsResult.errors, sourceSpan);
       bindingsResult.templateBindings.forEach((binding) => {
-        if (isPresent(binding.expression)) {
+        if (binding.expression) {
           this._checkPipes(binding.expression, sourceSpan);
         }
       });
@@ -193,7 +192,7 @@ export class BindingParser {
       name: string, value: string, sourceSpan: ParseSourceSpan, targetMatchableAttrs: string[][],
       targetProps: BoundProperty[]): boolean {
     const expr = this.parseInterpolation(value, sourceSpan);
-    if (isPresent(expr)) {
+    if (expr) {
       this._parsePropertyAst(name, expr, sourceSpan, targetMatchableAttrs, targetProps);
       return true;
     }
@@ -374,7 +373,7 @@ export class BindingParser {
   }
 
   private _checkPipes(ast: ASTWithSource, sourceSpan: ParseSourceSpan) {
-    if (isPresent(ast)) {
+    if (ast) {
       const collector = new PipeCollector();
       ast.visit(collector);
       collector.pipes.forEach((ast, pipeName) => {

modules/@angular/compiler/src/template_parser/template_parser.ts

@@ -149,7 +149,7 @@ export class TemplateParser {
       return new TemplateParseResult(result, errors);
     }
 
-    if (isPresent(this.transforms)) {
+    if (this.transforms) {
       this.transforms.forEach(
           (transform: TemplateAstVisitor) => { result = templateVisitAll(transform, result); });
     }
@@ -218,7 +218,7 @@ class TemplateParseVisitor implements html.Visitor {
   visitText(text: html.Text, parent: ElementContext): any {
     const ngContentIndex = parent.findNgContentIndex(TEXT_CSS_SELECTOR);
     const expr = this._bindingParser.parseInterpolation(text.value, text.sourceSpan);
-    if (isPresent(expr)) {
+    if (expr) {
       return new BoundTextAst(expr, ngContentIndex, text.sourceSpan);
     } else {
       return new TextAst(text.value, ngContentIndex, text.sourceSpan);
@@ -248,14 +248,14 @@ class TemplateParseVisitor implements html.Visitor {
       return null;
     }
 
-    const matchableAttrs: string[][] = [];
+    const matchableAttrs: [string, string][] = [];
     const elementOrDirectiveProps: BoundProperty[] = [];
     const elementOrDirectiveRefs: ElementOrDirectiveRef[] = [];
     const elementVars: VariableAst[] = [];
     const events: BoundEventAst[] = [];
 
     const templateElementOrDirectiveProps: BoundProperty[] = [];
-    const templateMatchableAttrs: string[][] = [];
+    const templateMatchableAttrs: [string, string][] = [];
     const templateElementVars: VariableAst[] = [];
 
     let hasInlineTemplates = false;
@@ -268,14 +268,17 @@ class TemplateParseVisitor implements html.Visitor {
           isTemplateElement, attr, matchableAttrs, elementOrDirectiveProps, events,
           elementOrDirectiveRefs, elementVars);
 
-      let templateBindingsSource: string|undefined = undefined;
-      let prefixToken: string|undefined = undefined;
-      if (this._normalizeAttributeName(attr.name) == TEMPLATE_ATTR) {
+      let templateBindingsSource: string|undefined;
+      let prefixToken: string|undefined;
+      let normalizedName = this._normalizeAttributeName(attr.name);
+
+      if (normalizedName == TEMPLATE_ATTR) {
         templateBindingsSource = attr.value;
-      } else if (attr.name.startsWith(TEMPLATE_ATTR_PREFIX)) {
+      } else if (normalizedName.startsWith(TEMPLATE_ATTR_PREFIX)) {
         templateBindingsSource = attr.value;
-        prefixToken = attr.name.substring(TEMPLATE_ATTR_PREFIX.length);  // remove the star
+        prefixToken = normalizedName.substring(TEMPLATE_ATTR_PREFIX.length) + ':';
       }
+
       const hasTemplateBinding = isPresent(templateBindingsSource);
       if (hasTemplateBinding) {
         if (hasInlineTemplates) {
@@ -285,7 +288,7 @@ class TemplateParseVisitor implements html.Visitor {
         }
         hasInlineTemplates = true;
         this._bindingParser.parseInlineTemplateBinding(
-            attr.name, prefixToken, templateBindingsSource, attr.sourceSpan, templateMatchableAttrs,
+            prefixToken, templateBindingsSource, attr.sourceSpan, templateMatchableAttrs,
             templateElementOrDirectiveProps, templateElementVars);
       }
 
@@ -306,9 +309,11 @@ class TemplateParseVisitor implements html.Visitor {
     const elementProps: BoundElementPropertyAst[] =
         this._createElementPropertyAsts(element.name, elementOrDirectiveProps, directiveAsts);
     const isViewRoot = parent.isTemplateElement || hasInlineTemplates;
+
     const providerContext = new ProviderElementContext(
         this.providerViewContext, parent.providerContext, isViewRoot, directiveAsts, attrs,
         references, element.sourceSpan);
+
     const children = html.visitAll(
         preparsedElement.nonBindable ? NON_BINDABLE_VISITOR : this, element.children,
         ElementContext.create(
@@ -541,10 +546,12 @@ class TemplateParseVisitor implements html.Visitor {
       elementSourceSpan: ParseSourceSpan, targetReferences: ReferenceAst[]): DirectiveAst[] {
     const matchedReferences = new Set<string>();
     let component: CompileDirectiveSummary = null;
+
     const directiveAsts = directives.map((directive) => {
       const sourceSpan = new ParseSourceSpan(
           elementSourceSpan.start, elementSourceSpan.end,
           `Directive ${identifierName(directive.type)}`);
+
       if (directive.isComponent) {
         component = directive;
       }
@@ -567,6 +574,7 @@ class TemplateParseVisitor implements html.Visitor {
       return new DirectiveAst(
           directive, directiveProperties, hostProperties, hostEvents, sourceSpan);
     });
+
     elementOrDirectiveRefs.forEach((elOrDirRef) => {
       if (elOrDirRef.value.length > 0) {
         if (!matchedReferences.has(elOrDirRef.name)) {
@@ -581,7 +589,7 @@ class TemplateParseVisitor implements html.Visitor {
         }
         targetReferences.push(new ReferenceAst(elOrDirRef.name, refToken, elOrDirRef.sourceSpan));
       }
-    });  // fix syntax highlighting issue: `
+    });
     return directiveAsts;
   }
 
@@ -742,7 +750,7 @@ class NonBindableVisitor implements html.Visitor {
       return null;
     }
 
-    const attrNameAndValues = ast.attrs.map(attrAst => [attrAst.name, attrAst.value]);
+    const attrNameAndValues = ast.attrs.map((attr): [string, string] => [attr.name, attr.value]);
     const selector = createElementCssSelector(ast.name, attrNameAndValues);
     const ngContentIndex = parent.findNgContentIndex(selector);
     const children = html.visitAll(this, ast.children, EMPTY_ELEMENT_CONTEXT);
@@ -811,16 +819,16 @@ class ElementContext {
 }
 
 export function createElementCssSelector(
-    elementName: string, matchableAttrs: string[][]): CssSelector {
+    elementName: string, attributes: [string, string][]): CssSelector {
   const cssSelector = new CssSelector();
   const elNameNoNs = splitNsName(elementName)[1];
 
   cssSelector.setElement(elNameNoNs);
 
-  for (let i = 0; i < matchableAttrs.length; i++) {
-    const attrName = matchableAttrs[i][0];
+  for (let i = 0; i < attributes.length; i++) {
+    const attrName = attributes[i][0];
     const attrNameNoNs = splitNsName(attrName)[1];
-    const attrValue = matchableAttrs[i][1];
+    const attrValue = attributes[i][1];
 
     cssSelector.addAttribute(attrNameNoNs, attrValue);
     if (attrName.toLowerCase() == CLASS_ATTR) {

modules/@angular/compiler/src/url_resolver.ts

@@ -26,7 +26,7 @@ export function createOfflineCompileUrlResolver(): UrlResolver {
 /**
  * A default provider for {@link PACKAGE_ROOT_URL} that maps to '/'.
  */
-export var DEFAULT_PACKAGE_URL_PROVIDER = {
+export const DEFAULT_PACKAGE_URL_PROVIDER = {
   provide: PACKAGE_ROOT_URL,
   useValue: '/'
 };

modules/@angular/compiler/src/view_compiler/compile_element.ts

@@ -7,9 +7,9 @@
  */
 
 
-import {CompileDiDependencyMetadata, CompileDirectiveSummary, CompileIdentifierMetadata, CompileProviderMetadata, CompileQueryMetadata, CompileTokenMetadata, identifierName, tokenName, tokenReference} from '../compile_metadata';
+import {CompileDiDependencyMetadata, CompileDirectiveSummary, CompileProviderMetadata, CompileQueryMetadata, CompileTokenMetadata, tokenName, tokenReference} from '../compile_metadata';
 import {createDiTokenExpression} from '../compiler_util/identifier_util';
-import {DirectiveWrapperCompiler, DirectiveWrapperExpressions} from '../directive_wrapper_compiler';
+import {DirectiveWrapperExpressions} from '../directive_wrapper_compiler';
 import {isPresent} from '../facade/lang';
 import {Identifiers, createIdentifier, createIdentifierToken, identifierToken, resolveIdentifier} from '../identifiers';
 import * as o from '../output/output_ast';
@@ -19,7 +19,7 @@ import {ProviderAst, ProviderAstType, ReferenceAst, TemplateAst} from '../templa
 import {CompileMethod} from './compile_method';
 import {CompileQuery, addQueryToTokenMap, createQueryList} from './compile_query';
 import {CompileView, CompileViewRootNode} from './compile_view';
-import {InjectMethodVars, ViewProperties} from './constants';
+import {InjectMethodVars} from './constants';
 import {ComponentFactoryDependency, DirectiveWrapperDependency} from './deps';
 import {getPropertyInView, injectFromViewParentInjector} from './util';
 
@@ -97,12 +97,11 @@ export class CompileElement extends CompileNode {
   }
 
   private _createComponentFactoryResolver() {
-    const entryComponents =
-        this.component.entryComponents.map((entryComponent: CompileIdentifierMetadata) => {
-          const id: CompileIdentifierMetadata = {reference: null};
-          this.view.targetDependencies.push(new ComponentFactoryDependency(entryComponent, id));
-          return id;
-        });
+    const entryComponents = this.component.entryComponents.map((entryComponent) => {
+      this.view.targetDependencies.push(
+          new ComponentFactoryDependency(entryComponent.componentType));
+      return {reference: entryComponent.componentFactory};
+    });
     if (!entryComponents || entryComponents.length === 0) {
       return;
     }
@@ -179,11 +178,11 @@ export class CompileElement extends CompileNode {
           const depsExpr =
               deps.map((dep) => this._getDependency(resolvedProvider.providerType, dep));
           if (isDirectiveWrapper) {
-            const directiveWrapperIdentifier: CompileIdentifierMetadata = {reference: null};
-            this.view.targetDependencies.push(new DirectiveWrapperDependency(
-                provider.useClass, DirectiveWrapperCompiler.dirWrapperClassName(provider.useClass),
-                directiveWrapperIdentifier));
-            return DirectiveWrapperExpressions.create(directiveWrapperIdentifier, depsExpr);
+            const dirMeta =
+                this._directives.find(dir => dir.type.reference === provider.useClass.reference);
+            this.view.targetDependencies.push(
+                new DirectiveWrapperDependency(dirMeta.type.reference));
+            return DirectiveWrapperExpressions.create({reference: dirMeta.wrapperType}, depsExpr);
           } else {
             return o.importExpr(provider.useClass)
                 .instantiate(depsExpr, o.importType(provider.useClass));
@@ -195,7 +194,7 @@ export class CompileElement extends CompileNode {
       const propName =
           `_${tokenName(resolvedProvider.token)}_${this.nodeIndex}_${this.instances.size}`;
       const instance = createProviderProperty(
-          propName, resolvedProvider, providerValueExpressions, resolvedProvider.multiProvider,
+          propName, providerValueExpressions, resolvedProvider.multiProvider,
           resolvedProvider.eager, this);
       if (isDirectiveWrapper) {
         this.directiveWrapperInstance.set(tokenReference(resolvedProvider.token), instance);
@@ -211,12 +210,7 @@ export class CompileElement extends CompileNode {
       const directiveInstance = this.instances.get(tokenReference(identifierToken(directive.type)));
       directive.queries.forEach((queryMeta) => { this._addQuery(queryMeta, directiveInstance); });
     }
-    const queriesWithReads: _QueryWithRead[] = [];
-    Array.from(this._resolvedProviders.values()).forEach((resolvedProvider) => {
-      const queriesForProvider = this._getQueriesFor(resolvedProvider.token);
-      queriesWithReads.push(
-          ...queriesForProvider.map(query => new _QueryWithRead(query, resolvedProvider.token)));
-    });
+
     Object.keys(this.referenceTokens).forEach(varName => {
       const token = this.referenceTokens[varName];
       let varValue: o.Expression;
@@ -226,27 +220,6 @@ export class CompileElement extends CompileNode {
         varValue = this.renderNode;
       }
       this.view.locals.set(varName, varValue);
-      const varToken = {value: varName};
-      queriesWithReads.push(
-          ...this._getQueriesFor(varToken).map(query => new _QueryWithRead(query, varToken)));
-    });
-    queriesWithReads.forEach((queryWithRead) => {
-      let value: o.Expression;
-      if (isPresent(queryWithRead.read.identifier)) {
-        // query for an identifier
-        value = this.instances.get(tokenReference(queryWithRead.read));
-      } else {
-        // query for a reference
-        const token = this.referenceTokens[queryWithRead.read.value];
-        if (isPresent(token)) {
-          value = this.instances.get(tokenReference(token));
-        } else {
-          value = this.elementRef;
-        }
-      }
-      if (isPresent(value)) {
-        queryWithRead.query.addValue(value, this.view);
-      }
     });
   }
 
@@ -265,12 +238,14 @@ export class CompileElement extends CompileNode {
       this.view.injectorGetMethod.addStmt(createInjectInternalCondition(
           this.nodeIndex, providerChildNodeCount, resolvedProvider, providerExpr));
     });
+  }
 
+  finish() {
     Array.from(this._queries.values())
         .forEach(
             queries => queries.forEach(
-                q =>
-                    q.afterChildren(this.view.createMethod, this.view.updateContentQueriesMethod)));
+                q => q.generateStatements(
+                    this.view.createMethod, this.view.updateContentQueriesMethod)));
   }
 
   addContentNode(ngContentIndex: number, nodeExpr: CompileViewRootNode) {
@@ -283,12 +258,11 @@ export class CompileElement extends CompileNode {
         null;
   }
 
-  getProviderTokens(): o.Expression[] {
-    return Array.from(this._resolvedProviders.values())
-        .map((resolvedProvider) => createDiTokenExpression(resolvedProvider.token));
+  getProviderTokens(): CompileTokenMetadata[] {
+    return Array.from(this._resolvedProviders.values()).map(provider => provider.token);
   }
 
-  private _getQueriesFor(token: CompileTokenMetadata): CompileQuery[] {
+  getQueriesFor(token: CompileTokenMetadata): CompileQuery[] {
     const result: CompileQuery[] = [];
     let currentEl: CompileElement = this;
     let distance = 0;
@@ -314,7 +288,7 @@ export class CompileElement extends CompileNode {
       CompileQuery {
     const propName =
         `_query_${tokenName(queryMeta.selectors[0])}_${this.nodeIndex}_${this._queryCount++}`;
-    const queryList = createQueryList(queryMeta, directiveInstance, propName, this.view);
+    const queryList = createQueryList(propName, this.view);
     const query = new CompileQuery(queryMeta, queryList, directiveInstance, this.view);
     addQueryToTokenMap(this._queries, query);
     return query;
@@ -394,8 +368,8 @@ function createInjectInternalCondition(
 }
 
 function createProviderProperty(
-    propName: string, provider: ProviderAst, providerValueExpressions: o.Expression[],
-    isMulti: boolean, isEager: boolean, compileElement: CompileElement): o.Expression {
+    propName: string, providerValueExpressions: o.Expression[], isMulti: boolean, isEager: boolean,
+    compileElement: CompileElement): o.Expression {
   const view = compileElement.view;
   let resolvedProviderValueExpr: o.Expression;
   let type: o.Type;
@@ -426,10 +400,3 @@ function createProviderProperty(
   }
   return o.THIS_EXPR.prop(propName);
 }
-
-class _QueryWithRead {
-  public read: CompileTokenMetadata;
-  constructor(public query: CompileQuery, match: CompileTokenMetadata) {
-    this.read = query.meta.read || match;
-  }
-}

modules/@angular/compiler/src/view_compiler/compile_method.ts

@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {isPresent} from '../facade/lang';
 import * as o from '../output/output_ast';
 import {TemplateAst} from '../template_parser/template_ast';
 
@@ -34,7 +33,7 @@ export class CompileMethod {
     if (this._newState.nodeIndex !== this._currState.nodeIndex ||
         this._newState.sourceAst !== this._currState.sourceAst) {
       const expr = this._updateDebugContext(this._newState);
-      if (isPresent(expr)) {
+      if (expr) {
         this._bodyStatements.push(expr.toStmt());
       }
     }
@@ -43,13 +42,12 @@ export class CompileMethod {
   private _updateDebugContext(newState: _DebugState): o.Expression {
     this._currState = this._newState = newState;
     if (this._debugEnabled) {
-      const sourceLocation =
-          isPresent(newState.sourceAst) ? newState.sourceAst.sourceSpan.start : null;
+      const sourceLocation = newState.sourceAst ? newState.sourceAst.sourceSpan.start : null;
 
       return o.THIS_EXPR.callMethod('debug', [
         o.literal(newState.nodeIndex),
-        isPresent(sourceLocation) ? o.literal(sourceLocation.line) : o.NULL_EXPR,
-        isPresent(sourceLocation) ? o.literal(sourceLocation.col) : o.NULL_EXPR
+        sourceLocation ? o.literal(sourceLocation.line) : o.NULL_EXPR,
+        sourceLocation ? o.literal(sourceLocation.col) : o.NULL_EXPR
       ]);
     } else {
       return null;

modules/@angular/compiler/src/view_compiler/compile_query.ts

@@ -8,7 +8,6 @@
 
 import {CompileQueryMetadata, tokenReference} from '../compile_metadata';
 import {ListWrapper} from '../facade/collection';
-import {isPresent} from '../facade/lang';
 import {Identifiers, createIdentifier} from '../identifiers';
 import * as o from '../output/output_ast';
 
@@ -33,7 +32,7 @@ export class CompileQuery {
   addValue(value: o.Expression, view: CompileView) {
     let currentView = view;
     const elPath: CompileElement[] = [];
-    while (isPresent(currentView) && currentView !== this.view) {
+    while (currentView && currentView !== this.view) {
       const parentEl = currentView.declarationElement;
       elPath.unshift(parentEl);
       currentView = parentEl.view;
@@ -64,10 +63,10 @@ export class CompileQuery {
     return !this._values.values.some(value => value instanceof ViewQueryValues);
   }
 
-  afterChildren(targetStaticMethod: CompileMethod, targetDynamicMethod: CompileMethod) {
+  generateStatements(targetStaticMethod: CompileMethod, targetDynamicMethod: CompileMethod) {
     const values = createQueryValues(this._values);
     const updateStmts = [this.queryList.callMethod('reset', [o.literalArr(values)]).toStmt()];
-    if (isPresent(this.ownerDirectiveExpression)) {
+    if (this.ownerDirectiveExpression) {
       const valueExpr = this.meta.first ? this.queryList.prop('first') : this.queryList;
       updateStmts.push(
           this.ownerDirectiveExpression.prop(this.meta.propertyName).set(valueExpr).toStmt());
@@ -110,9 +109,7 @@ function mapNestedViews(
   ]);
 }
 
-export function createQueryList(
-    query: CompileQueryMetadata, directiveInstance: o.Expression, propertyName: string,
-    compileView: CompileView): o.Expression {
+export function createQueryList(propertyName: string, compileView: CompileView): o.Expression {
   compileView.fields.push(new o.ClassField(
       propertyName, o.importType(createIdentifier(Identifiers.QueryList), [o.DYNAMIC_TYPE])));
   const expr = o.THIS_EXPR.prop(propertyName);

modules/@angular/compiler/src/view_compiler/compile_view.ts

@@ -7,12 +7,10 @@
  */
 
 import {AnimationEntryCompileResult} from '../animation/animation_compiler';
-import {CompileDirectiveMetadata, CompileIdentifierMetadata, CompilePipeSummary, tokenName} from '../compile_metadata';
+import {CompileDirectiveMetadata, CompilePipeSummary, tokenName, viewClassName} from '../compile_metadata';
 import {EventHandlerVars, NameResolver} from '../compiler_util/expression_converter';
-import {createPureProxy} from '../compiler_util/identifier_util';
 import {CompilerConfig} from '../config';
 import {isPresent} from '../facade/lang';
-import {Identifiers, createIdentifier} from '../identifiers';
 import * as o from '../output/output_ast';
 import {ViewType} from '../private_import_core';
 
@@ -20,8 +18,8 @@ import {CompileElement, CompileNode} from './compile_element';
 import {CompileMethod} from './compile_method';
 import {CompilePipe} from './compile_pipe';
 import {CompileQuery, addQueryToTokenMap, createQueryList} from './compile_query';
-import {ComponentFactoryDependency, DirectiveWrapperDependency, ViewClassDependency} from './deps';
-import {getPropertyInView, getViewClassName} from './util';
+import {ComponentFactoryDependency, ComponentViewDependency, DirectiveWrapperDependency} from './deps';
+import {getPropertyInView} from './util';
 
 export enum CompileViewRootNodeType {
   Node,
@@ -87,7 +85,7 @@ export class CompileView implements NameResolver {
       public animations: AnimationEntryCompileResult[], public viewIndex: number,
       public declarationElement: CompileElement, public templateVariableBindings: string[][],
       public targetDependencies:
-          Array<ViewClassDependency|ComponentFactoryDependency|DirectiveWrapperDependency>) {
+          Array<ComponentViewDependency|ComponentFactoryDependency|DirectiveWrapperDependency>) {
     this.createMethod = new CompileMethod(this);
     this.animationBindingsMethod = new CompileMethod(this);
     this.injectorGetMethod = new CompileMethod(this);
@@ -103,7 +101,7 @@ export class CompileView implements NameResolver {
     this.detachMethod = new CompileMethod(this);
 
     this.viewType = getViewType(component, viewIndex);
-    this.className = getViewClassName(component, viewIndex);
+    this.className = viewClassName(component.type.reference, viewIndex);
     this.classType = o.expressionType(o.variable(this.className));
     this.classExpr = o.variable(this.className);
     if (this.viewType === ViewType.COMPONENT || this.viewType === ViewType.HOST) {
@@ -119,7 +117,7 @@ export class CompileView implements NameResolver {
       const directiveInstance = o.THIS_EXPR.prop('context');
       this.component.viewQueries.forEach((queryMeta, queryIndex) => {
         const propName = `_viewQuery_${tokenName(queryMeta.selectors[0])}_${queryIndex}`;
-        const queryList = createQueryList(queryMeta, directiveInstance, propName, this);
+        const queryList = createQueryList(propName, this);
         const query = new CompileQuery(queryMeta, queryList, directiveInstance, this);
         addQueryToTokenMap(viewQueries, query);
       });
@@ -154,11 +152,11 @@ export class CompileView implements NameResolver {
     }
   }
 
-  afterNodes() {
+  finish() {
     Array.from(this.viewQueries.values())
         .forEach(
             queries => queries.forEach(
-                q => q.afterChildren(this.createMethod, this.updateViewQueriesMethod)));
+                q => q.generateStatements(this.createMethod, this.updateViewQueriesMethod)));
   }
 }
 

modules/@angular/compiler/src/view_compiler/constants.ts

@@ -11,7 +11,7 @@ import {ChangeDetectionStrategy, ViewEncapsulation} from '@angular/core';
 import {createEnumExpression} from '../compiler_util/identifier_util';
 import {Identifiers} from '../identifiers';
 import * as o from '../output/output_ast';
-import {ChangeDetectorStatus, ViewType} from '../private_import_core';
+import {ViewType} from '../private_import_core';
 
 export class ViewTypeEnum {
   static fromValue(value: ViewType): o.Expression {
@@ -25,12 +25,6 @@ export class ViewEncapsulationEnum {
   }
 }
 
-export class ChangeDetectionStrategyEnum {
-  static fromValue(value: ChangeDetectionStrategy): o.Expression {
-    return createEnumExpression(Identifiers.ChangeDetectionStrategy, value);
-  }
-}
-
 export class ChangeDetectorStatusEnum {
   static fromValue(value: ChangeDetectorStatusEnum): o.Expression {
     return createEnumExpression(Identifiers.ChangeDetectorStatus, value);
@@ -47,6 +41,7 @@ export class ViewConstructorVars {
 export class ViewProperties {
   static renderer = o.THIS_EXPR.prop('renderer');
   static viewUtils = o.THIS_EXPR.prop('viewUtils');
+  static throwOnChange = o.THIS_EXPR.prop('throwOnChange');
 }
 
 export class InjectMethodVars {
@@ -54,9 +49,3 @@ export class InjectMethodVars {
   static requestNodeIndex = o.variable('requestNodeIndex');
   static notFoundResult = o.variable('notFoundResult');
 }
-
-export class DetectChangesVars {
-  static throwOnChange = o.variable(`throwOnChange`);
-  static changes = o.variable(`changes`);
-  static changed = o.variable(`changed`);
-}

modules/@angular/compiler/src/view_compiler/deps.ts

@@ -6,21 +6,26 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CompileIdentifierMetadata} from '../compile_metadata';
-
-export class ViewClassDependency {
-  constructor(
-      public comp: CompileIdentifierMetadata, public name: string,
-      public placeholder: CompileIdentifierMetadata) {}
+/**
+ * This is currently not read, but will probably be used in the future.
+ * We keep it as we already pass it through all the right places...
+ */
+export class ComponentViewDependency {
+  constructor(public compType: any) {}
 }
 
+/**
+ * This is currently not read, but will probably be used in the future.
+ * We keep it as we already pass it through all the right places...
+ */
 export class ComponentFactoryDependency {
-  constructor(
-      public comp: CompileIdentifierMetadata, public placeholder: CompileIdentifierMetadata) {}
+  constructor(public compType: any) {}
 }
 
+/**
+ * This is currently not read, but will probably be used in the future.
+ * We keep it as we already pass it through all the right places...
+ */
 export class DirectiveWrapperDependency {
-  constructor(
-      public dir: CompileIdentifierMetadata, public name: string,
-      public placeholder: CompileIdentifierMetadata) {}
+  constructor(public dirType: any) {}
 }

modules/@angular/compiler/src/view_compiler/event_binder.ts

@@ -15,7 +15,6 @@ import {BoundEventAst, DirectiveAst} from '../template_parser/template_ast';
 
 import {CompileElement} from './compile_element';
 import {CompileMethod} from './compile_method';
-import {ViewProperties} from './constants';
 import {getHandleEventMethodName} from './util';
 
 export function bindOutputs(
@@ -133,4 +132,4 @@ type EventSummary = {
   name: string,
   target: string,
   phase: string
-}
+};

modules/@angular/compiler/src/view_compiler/lifecycle_binder.ts

@@ -7,6 +7,7 @@
  */
 
 import {CompileDirectiveSummary, CompilePipeSummary} from '../compile_metadata';
+import {isFirstViewCheck} from '../compiler_util/binding_util';
 import {DirectiveWrapperExpressions} from '../directive_wrapper_compiler';
 import * as o from '../output/output_ast';
 import {LifecycleHooks} from '../private_import_core';
@@ -14,10 +15,6 @@ import {DirectiveAst, ProviderAst, ProviderAstType} from '../template_parser/tem
 
 import {CompileElement} from './compile_element';
 import {CompileView} from './compile_view';
-import {DetectChangesVars} from './constants';
-
-const STATE_IS_NEVER_CHECKED = o.THIS_EXPR.prop('numberOfChecks').identical(new o.LiteralExpr(0));
-const NOT_THROW_ON_CHANGES = o.not(DetectChangesVars.throwOnChange);
 
 export function bindDirectiveAfterContentLifecycleCallbacks(
     directiveMeta: CompileDirectiveSummary, directiveInstance: o.Expression,
@@ -29,7 +26,8 @@ export function bindDirectiveAfterContentLifecycleCallbacks(
       compileElement.nodeIndex, compileElement.sourceAst);
   if (lifecycleHooks.indexOf(LifecycleHooks.AfterContentInit) !== -1) {
     afterContentLifecycleCallbacksMethod.addStmt(new o.IfStmt(
-        STATE_IS_NEVER_CHECKED, [directiveInstance.callMethod('ngAfterContentInit', []).toStmt()]));
+        isFirstViewCheck(o.THIS_EXPR),
+        [directiveInstance.callMethod('ngAfterContentInit', []).toStmt()]));
   }
   if (lifecycleHooks.indexOf(LifecycleHooks.AfterContentChecked) !== -1) {
     afterContentLifecycleCallbacksMethod.addStmt(
@@ -47,7 +45,8 @@ export function bindDirectiveAfterViewLifecycleCallbacks(
       compileElement.nodeIndex, compileElement.sourceAst);
   if (lifecycleHooks.indexOf(LifecycleHooks.AfterViewInit) !== -1) {
     afterViewLifecycleCallbacksMethod.addStmt(new o.IfStmt(
-        STATE_IS_NEVER_CHECKED, [directiveInstance.callMethod('ngAfterViewInit', []).toStmt()]));
+        isFirstViewCheck(o.THIS_EXPR),
+        [directiveInstance.callMethod('ngAfterViewInit', []).toStmt()]));
   }
   if (lifecycleHooks.indexOf(LifecycleHooks.AfterViewChecked) !== -1) {
     afterViewLifecycleCallbacksMethod.addStmt(

modules/@angular/compiler/src/view_compiler/property_binder.ts

@@ -8,19 +8,19 @@
 
 import {SecurityContext} from '@angular/core';
 
-import {createCheckBindingField, createCheckBindingStmt} from '../compiler_util/binding_util';
-import {ConvertPropertyBindingResult, convertPropertyBinding} from '../compiler_util/expression_converter';
+import {createCheckBindingField} from '../compiler_util/binding_util';
+import {convertPropertyBinding} from '../compiler_util/expression_converter';
 import {createEnumExpression} from '../compiler_util/identifier_util';
-import {triggerAnimation, writeToRenderer} from '../compiler_util/render_util';
+import {createCheckAnimationBindingStmts, createCheckRenderBindingStmt} from '../compiler_util/render_util';
 import {DirectiveWrapperExpressions} from '../directive_wrapper_compiler';
 import {Identifiers, createIdentifier} from '../identifiers';
 import * as o from '../output/output_ast';
 import {isDefaultChangeDetectionStrategy} from '../private_import_core';
 import {ElementSchemaRegistry} from '../schema/element_schema_registry';
 import {BoundElementPropertyAst, BoundEventAst, BoundTextAst, DirectiveAst, PropertyBindingType} from '../template_parser/template_ast';
+
 import {CompileElement, CompileNode} from './compile_element';
 import {CompileView} from './compile_view';
-import {DetectChangesVars} from './constants';
 import {getHandleEventMethodName} from './util';
 
 export function bindRenderText(
@@ -33,11 +33,15 @@ export function bindRenderText(
   }
 
   view.detectChangesRenderPropertiesMethod.resetDebugInfo(compileNode.nodeIndex, boundText);
-  view.detectChangesRenderPropertiesMethod.addStmts(createCheckBindingStmt(
-      evalResult, valueField.expression, DetectChangesVars.throwOnChange,
-      [o.THIS_EXPR.prop('renderer')
-           .callMethod('setText', [compileNode.renderNode, evalResult.currValExpr])
-           .toStmt()]));
+  view.detectChangesRenderPropertiesMethod.addStmts(evalResult.stmts);
+  view.detectChangesRenderPropertiesMethod.addStmt(
+      o.importExpr(createIdentifier(Identifiers.checkRenderText))
+          .callFn([
+            o.THIS_EXPR, compileNode.renderNode, valueField.expression,
+            valueField.expression.set(evalResult.currValExpr),
+            evalResult.forceUpdate || o.literal(false)
+          ])
+          .toStmt());
 }
 
 export function bindRenderInputs(
@@ -54,31 +58,27 @@ export function bindRenderInputs(
     if (!evalResult) {
       return;
     }
-    const checkBindingStmts: o.Statement[] = [];
     let compileMethod = view.detectChangesRenderPropertiesMethod;
     switch (boundProp.type) {
       case PropertyBindingType.Property:
       case PropertyBindingType.Attribute:
       case PropertyBindingType.Class:
       case PropertyBindingType.Style:
-        checkBindingStmts.push(...writeToRenderer(
-            o.THIS_EXPR, boundProp, renderNode, evalResult.currValExpr,
-            view.genConfig.logBindingUpdate));
+        compileMethod.addStmts(createCheckRenderBindingStmt(
+            o.THIS_EXPR, renderNode, boundProp, bindingField.expression, evalResult));
         break;
       case PropertyBindingType.Animation:
         compileMethod = view.animationBindingsMethod;
-        const {updateStmts, detachStmts} = triggerAnimation(
+        const {checkUpdateStmts, checkDetachStmts} = createCheckAnimationBindingStmts(
             o.THIS_EXPR, o.THIS_EXPR, boundProp, boundOutputs,
             (hasEvents ? o.THIS_EXPR.prop(getHandleEventMethodName(compileElement.nodeIndex)) :
                          o.importExpr(createIdentifier(Identifiers.noop)))
                 .callMethod(o.BuiltinMethod.Bind, [o.THIS_EXPR]),
-            compileElement.renderNode, evalResult.currValExpr, bindingField.expression);
-        checkBindingStmts.push(...updateStmts);
-        view.detachMethod.addStmts(detachStmts);
+            compileElement.renderNode, bindingField.expression, evalResult);
+        view.detachMethod.addStmts(checkDetachStmts);
+        compileMethod.addStmts(checkUpdateStmts);
         break;
     }
-    compileMethod.addStmts(createCheckBindingStmt(
-        evalResult, bindingField.expression, DetectChangesVars.throwOnChange, checkBindingStmts));
   });
 }
 
@@ -108,7 +108,7 @@ export function bindDirectiveHostProps(
       DirectiveWrapperExpressions.checkHost(
           directiveAst.hostProperties, directiveWrapperInstance, o.THIS_EXPR,
           compileElement.compViewExpr || o.THIS_EXPR, compileElement.renderNode,
-          DetectChangesVars.throwOnChange, runtimeSecurityCtxExprs));
+          runtimeSecurityCtxExprs));
 }
 
 export function bindDirectiveInputs(
@@ -132,17 +132,13 @@ export function bindDirectiveInputs(
         directiveWrapperInstance
             .callMethod(
                 `check_${input.directiveName}`,
-                [
-                  evalResult.currValExpr, DetectChangesVars.throwOnChange,
-                  evalResult.forceUpdate || o.literal(false)
-                ])
+                [o.THIS_EXPR, evalResult.currValExpr, evalResult.forceUpdate || o.literal(false)])
             .toStmt());
   });
   const isOnPushComp = directiveAst.directive.isComponent &&
       !isDefaultChangeDetectionStrategy(directiveAst.directive.changeDetection);
   const directiveDetectChangesExpr = DirectiveWrapperExpressions.ngDoCheck(
-      directiveWrapperInstance, o.THIS_EXPR, compileElement.renderNode,
-      DetectChangesVars.throwOnChange);
+      directiveWrapperInstance, o.THIS_EXPR, compileElement.renderNode);
   const directiveDetectChangesStmt = isOnPushComp ?
       new o.IfStmt(
           directiveDetectChangesExpr,

modules/@angular/compiler/src/view_compiler/query_binder.ts

@@ -0,0 +1,57 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import {CompileTokenMetadata, tokenReference} from '../compile_metadata';
+import * as o from '../output/output_ast';
+
+import {CompileElement} from './compile_element';
+import {CompileQuery} from './compile_query';
+
+
+// Note: We can't do this when we create the CompileElements already,
+// as we create embedded views before the <template> elements themselves.
+export function bindQueryValues(ce: CompileElement) {
+  const queriesWithReads: _QueryWithRead[] = [];
+
+  ce.getProviderTokens().forEach((token) => {
+    const queriesForProvider = ce.getQueriesFor(token);
+    queriesWithReads.push(...queriesForProvider.map(query => new _QueryWithRead(query, token)));
+  });
+
+  Object.keys(ce.referenceTokens).forEach(varName => {
+    const varToken = {value: varName};
+    queriesWithReads.push(
+        ...ce.getQueriesFor(varToken).map(query => new _QueryWithRead(query, varToken)));
+  });
+
+  queriesWithReads.forEach((queryWithRead) => {
+    let value: o.Expression;
+    if (queryWithRead.read.identifier) {
+      // query for an identifier
+      value = ce.instances.get(tokenReference(queryWithRead.read));
+    } else {
+      // query for a reference
+      const token = ce.referenceTokens[queryWithRead.read.value];
+      if (token) {
+        value = ce.instances.get(tokenReference(token));
+      } else {
+        value = ce.elementRef;
+      }
+    }
+    if (value) {
+      queryWithRead.query.addValue(value, ce.view);
+    }
+  });
+}
+
+class _QueryWithRead {
+  public read: CompileTokenMetadata;
+  constructor(public query: CompileQuery, match: CompileTokenMetadata) {
+    this.read = query.meta.read || match;
+  }
+}

modules/@angular/compiler/src/view_compiler/util.ts

@@ -7,10 +7,8 @@
  */
 
 
-import {CompileDirectiveMetadata, CompileDirectiveSummary, CompileIdentifierMetadata, CompileTokenMetadata, identifierName} from '../compile_metadata';
+import {CompileTokenMetadata} from '../compile_metadata';
 import {createDiTokenExpression} from '../compiler_util/identifier_util';
-import {isPresent} from '../facade/lang';
-import {Identifiers, createIdentifier} from '../identifiers';
 import * as o from '../output/output_ast';
 import {ViewType} from '../private_import_core';
 
@@ -23,7 +21,7 @@ export function getPropertyInView(
   } else {
     let viewProp: o.Expression = o.THIS_EXPR;
     let currView: CompileView = callingView;
-    while (currView !== definedView && isPresent(currView.declarationElement.view)) {
+    while (currView !== definedView && currView.declarationElement.view) {
       currView = currView.declarationElement.view;
       viewProp = viewProp.prop('parentView');
     }
@@ -71,12 +69,6 @@ export function injectFromViewParentInjector(
   return viewExpr.callMethod('injectorGet', args);
 }
 
-export function getViewClassName(
-    component: CompileDirectiveSummary | CompileDirectiveMetadata,
-    embeddedTemplateIndex: number): string {
-  return `View_${identifierName(component.type)}${embeddedTemplateIndex}`;
-}
-
 export function getHandleEventMethodName(elementIndex: number): string {
   return `handleEvent_${elementIndex}`;
 }

modules/@angular/compiler/src/view_compiler/view_binder.ts

@@ -15,6 +15,7 @@ import {CompileView} from './compile_view';
 import {bindOutputs} from './event_binder';
 import {bindDirectiveAfterContentLifecycleCallbacks, bindDirectiveAfterViewLifecycleCallbacks, bindDirectiveWrapperLifecycleCallbacks, bindInjectableDestroyLifecycleCallbacks, bindPipeDestroyLifecycleCallbacks} from './lifecycle_binder';
 import {bindDirectiveHostProps, bindDirectiveInputs, bindRenderInputs, bindRenderText} from './property_binder';
+import {bindQueryValues} from './query_binder';
 
 export function bindView(
     view: CompileView, parsedTemplate: TemplateAst[], schemaRegistry: ElementSchemaRegistry): void {
@@ -43,6 +44,7 @@ class ViewBinderVisitor implements TemplateAstVisitor {
 
   visitElement(ast: ElementAst, parent: CompileElement): any {
     const compileElement = <CompileElement>this.view.nodes[this._nodeIndex++];
+    bindQueryValues(compileElement);
     const hasEvents = bindOutputs(ast.outputs, ast.directives, compileElement, true);
     bindRenderInputs(ast.inputs, ast.outputs, hasEvents, compileElement);
     ast.directives.forEach((directiveAst, dirIndex) => {
@@ -75,6 +77,7 @@ class ViewBinderVisitor implements TemplateAstVisitor {
 
   visitEmbeddedTemplate(ast: EmbeddedTemplateAst, parent: CompileElement): any {
     const compileElement = <CompileElement>this.view.nodes[this._nodeIndex++];
+    bindQueryValues(compileElement);
     bindOutputs(ast.outputs, ast.directives, compileElement, false);
     ast.directives.forEach((directiveAst, dirIndex) => {
       const directiveInstance = compileElement.instances.get(directiveAst.directive.type.reference);

modules/@angular/compiler/src/view_compiler/view_builder.ts

@@ -8,22 +8,20 @@
 
 import {ViewEncapsulation} from '@angular/core';
 
-import {CompileDirectiveMetadata, CompileDirectiveSummary, CompileIdentifierMetadata, CompileTokenMetadata, identifierModuleUrl, identifierName} from '../compile_metadata';
+import {CompileDirectiveSummary, identifierModuleUrl, identifierName} from '../compile_metadata';
 import {createSharedBindingVariablesIfNeeded} from '../compiler_util/expression_converter';
 import {createDiTokenExpression, createInlineArray} from '../compiler_util/identifier_util';
 import {isPresent} from '../facade/lang';
 import {Identifiers, createIdentifier, identifierToken} from '../identifiers';
 import {createClassStmt} from '../output/class_builder';
 import * as o from '../output/output_ast';
-import {ParseSourceSpan} from '../parse_util';
 import {ChangeDetectorStatus, ViewType, isDefaultChangeDetectionStrategy} from '../private_import_core';
 import {AttrAst, BoundDirectivePropertyAst, BoundElementPropertyAst, BoundEventAst, BoundTextAst, DirectiveAst, ElementAst, EmbeddedTemplateAst, NgContentAst, ReferenceAst, TemplateAst, TemplateAstVisitor, TextAst, VariableAst, templateVisitAll} from '../template_parser/template_ast';
 
 import {CompileElement, CompileNode} from './compile_element';
 import {CompileView, CompileViewRootNode, CompileViewRootNodeType} from './compile_view';
-import {ChangeDetectorStatusEnum, DetectChangesVars, InjectMethodVars, ViewConstructorVars, ViewEncapsulationEnum, ViewProperties, ViewTypeEnum} from './constants';
-import {ComponentFactoryDependency, DirectiveWrapperDependency, ViewClassDependency} from './deps';
-import {getViewClassName} from './util';
+import {ChangeDetectorStatusEnum, InjectMethodVars, ViewConstructorVars, ViewEncapsulationEnum, ViewProperties, ViewTypeEnum} from './constants';
+import {ComponentFactoryDependency, ComponentViewDependency, DirectiveWrapperDependency} from './deps';
 
 const IMPLICIT_TEMPLATE_VAR = '\$implicit';
 const CLASS_ATTR = 'class';
@@ -36,7 +34,8 @@ const rootSelectorVar = o.variable('rootSelector');
 export function buildView(
     view: CompileView, template: TemplateAst[],
     targetDependencies:
-        Array<ViewClassDependency|ComponentFactoryDependency|DirectiveWrapperDependency>): number {
+        Array<ComponentViewDependency|ComponentFactoryDependency|DirectiveWrapperDependency>):
+    number {
   const builderVisitor = new ViewBuilderVisitor(view, targetDependencies);
   const parentEl =
       view.declarationElement.isNull() ? view.declarationElement : view.declarationElement.parent;
@@ -48,13 +47,16 @@ export function buildView(
 }
 
 export function finishView(view: CompileView, targetStatements: o.Statement[]) {
-  view.afterNodes();
-  createViewTopLevelStmts(view, targetStatements);
   view.nodes.forEach((node) => {
-    if (node instanceof CompileElement && node.hasEmbeddedView) {
-      finishView(node.embeddedView, targetStatements);
+    if (node instanceof CompileElement) {
+      node.finish();
+      if (node.hasEmbeddedView) {
+        finishView(node.embeddedView, targetStatements);
+      }
     }
   });
+  view.finish();
+  createViewTopLevelStmts(view, targetStatements);
 }
 
 class ViewBuilderVisitor implements TemplateAstVisitor {
@@ -63,7 +65,7 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
   constructor(
       public view: CompileView,
       public targetDependencies:
-          Array<ViewClassDependency|ComponentFactoryDependency|DirectiveWrapperDependency>) {}
+          Array<ComponentViewDependency|ComponentFactoryDependency|DirectiveWrapperDependency>) {}
 
   private _isRootNode(parent: CompileElement): boolean { return parent.view !== this.view; }
 
@@ -214,9 +216,7 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
     this.view.nodes.push(compileElement);
     let compViewExpr: o.ReadPropExpr = null;
     if (isPresent(component)) {
-      const nestedComponentIdentifier: CompileIdentifierMetadata = {reference: null};
-      this.targetDependencies.push(new ViewClassDependency(
-          component.type, getViewClassName(component, 0), nestedComponentIdentifier));
+      this.targetDependencies.push(new ComponentViewDependency(component.type.reference));
 
       compViewExpr = o.THIS_EXPR.prop(`compView_${nodeIndex}`);  // fix highlighting: `
       this.view.fields.push(new o.ClassField(
@@ -226,7 +226,7 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
       compileElement.setComponentView(compViewExpr);
       this.view.createMethod.addStmt(
           compViewExpr
-              .set(o.importExpr(nestedComponentIdentifier).instantiate([
+              .set(o.importExpr({reference: component.componentViewType}).instantiate([
                 ViewProperties.viewUtils, o.THIS_EXPR, o.literal(nodeIndex), renderNode
               ]))
               .toStmt());
@@ -418,7 +418,9 @@ function createStaticNodeDebugInfo(node: CompileNode): o.Expression {
   let componentToken: o.Expression = o.NULL_EXPR;
   const varTokenEntries: any[] = [];
   if (isPresent(compileElement)) {
-    providerTokens = compileElement.getProviderTokens();
+    providerTokens =
+        compileElement.getProviderTokens().map((token) => createDiTokenExpression(token));
+
     if (isPresent(compileElement.component)) {
       componentToken = createDiTokenExpression(identifierToken(compileElement.component.type));
     }
@@ -480,9 +482,7 @@ function createViewClass(
         ],
         addReturnValuefNotEmpty(view.injectorGetMethod.finish(), InjectMethodVars.notFoundResult),
         o.DYNAMIC_TYPE),
-    new o.ClassMethod(
-        'detectChangesInternal', [new o.FnParam(DetectChangesVars.throwOnChange.name, o.BOOL_TYPE)],
-        generateDetectChangesMethod(view)),
+    new o.ClassMethod('detectChangesInternal', [], generateDetectChangesMethod(view)),
     new o.ClassMethod('dirtyParentQueriesInternal', [], view.dirtyParentQueriesMethod.finish()),
     new o.ClassMethod('destroyInternal', [], generateDestroyMethod(view)),
     new o.ClassMethod('detachInternal', [], view.detachMethod.finish()),
@@ -566,36 +566,26 @@ function generateDetectChangesMethod(view: CompileView): o.Statement[] {
   stmts.push(...view.detectChangesInInputsMethod.finish());
   view.viewContainers.forEach((viewContainer) => {
     stmts.push(
-        viewContainer.callMethod('detectChangesInNestedViews', [DetectChangesVars.throwOnChange])
+        viewContainer.callMethod('detectChangesInNestedViews', [ViewProperties.throwOnChange])
             .toStmt());
   });
   const afterContentStmts = view.updateContentQueriesMethod.finish().concat(
       view.afterContentLifecycleCallbacksMethod.finish());
   if (afterContentStmts.length > 0) {
-    stmts.push(new o.IfStmt(o.not(DetectChangesVars.throwOnChange), afterContentStmts));
+    stmts.push(new o.IfStmt(o.not(ViewProperties.throwOnChange), afterContentStmts));
   }
   stmts.push(...view.detectChangesRenderPropertiesMethod.finish());
   view.viewChildren.forEach((viewChild) => {
     stmts.push(
-        viewChild.callMethod('internalDetectChanges', [DetectChangesVars.throwOnChange]).toStmt());
+        viewChild.callMethod('internalDetectChanges', [ViewProperties.throwOnChange]).toStmt());
   });
   const afterViewStmts =
       view.updateViewQueriesMethod.finish().concat(view.afterViewLifecycleCallbacksMethod.finish());
   if (afterViewStmts.length > 0) {
-    stmts.push(new o.IfStmt(o.not(DetectChangesVars.throwOnChange), afterViewStmts));
+    stmts.push(new o.IfStmt(o.not(ViewProperties.throwOnChange), afterViewStmts));
   }
 
-  const varStmts: any[] = [];
-  const readVars = o.findReadVarNames(stmts);
-  if (readVars.has(DetectChangesVars.changed.name)) {
-    varStmts.push(DetectChangesVars.changed.set(o.literal(true)).toDeclStmt(o.BOOL_TYPE));
-  }
-  if (readVars.has(DetectChangesVars.changes.name)) {
-    varStmts.push(
-        DetectChangesVars.changes.set(o.NULL_EXPR)
-            .toDeclStmt(new o.MapType(o.importType(createIdentifier(Identifiers.SimpleChange)))));
-  }
-  varStmts.push(...createSharedBindingVariablesIfNeeded(stmts));
+  const varStmts = createSharedBindingVariablesIfNeeded(stmts);
   return varStmts.concat(stmts);
 }
 
@@ -690,7 +680,6 @@ function generateCreateEmbeddedViewsMethod(view: CompileView): o.ClassMethod {
   view.nodes.forEach((node) => {
     if (node instanceof CompileElement) {
       if (node.embeddedView) {
-        const parentNodeIndex = node.isRootElement() ? null : node.parent.nodeIndex;
         stmts.push(new o.IfStmt(
             nodeIndexVar.equals(o.literal(node.nodeIndex)),
             [new o.ReturnStatement(node.embeddedView.classExpr.instantiate([

modules/@angular/compiler/src/view_compiler/view_compiler.ts

@@ -16,17 +16,17 @@ import {TemplateAst} from '../template_parser/template_ast';
 
 import {CompileElement} from './compile_element';
 import {CompileView} from './compile_view';
-import {ComponentFactoryDependency, DirectiveWrapperDependency, ViewClassDependency} from './deps';
+import {ComponentFactoryDependency, ComponentViewDependency, DirectiveWrapperDependency} from './deps';
 import {bindView} from './view_binder';
 import {buildView, finishView} from './view_builder';
 
-export {ComponentFactoryDependency, DirectiveWrapperDependency, ViewClassDependency} from './deps';
+export {ComponentFactoryDependency, ComponentViewDependency, DirectiveWrapperDependency} from './deps';
 
 export class ViewCompileResult {
   constructor(
       public statements: o.Statement[], public viewClassVar: string,
       public dependencies:
-          Array<ViewClassDependency|ComponentFactoryDependency|DirectiveWrapperDependency>) {}
+          Array<ComponentViewDependency|ComponentFactoryDependency|DirectiveWrapperDependency>) {}
 }
 
 @CompilerInjectable()
@@ -38,7 +38,7 @@ export class ViewCompiler {
       pipes: CompilePipeSummary[],
       compiledAnimations: AnimationEntryCompileResult[]): ViewCompileResult {
     const dependencies:
-        Array<ViewClassDependency|ComponentFactoryDependency|DirectiveWrapperDependency> = [];
+        Array<ComponentViewDependency|ComponentFactoryDependency|DirectiveWrapperDependency> = [];
     const view = new CompileView(
         component, this._genConfig, pipes, styles, compiledAnimations, 0,
         CompileElement.createNull(), [], dependencies);

modules/@angular/compiler/test/aot/static_reflector_spec.ts

@@ -449,6 +449,40 @@ describe('StaticReflector', () => {
     expect(annotations[0].providers[0].useValue.members[0]).toEqual('staticMethod');
   });
 
+  // #13605
+  it('should not throw on unknown decorators', () => {
+    const data = Object.create(DEFAULT_TEST_DATA);
+    const file = '/tmp/src/app.component.ts';
+    data[file] = `
+      import { Component } from '@angular/core';
+
+      export const enum TypeEnum {
+        type
+      }
+
+      export function MyValidationDecorator(p1: any, p2: any): any {
+        return null;
+      }
+
+      export function ValidationFunction(a1: any): any {
+        return null;
+      }
+
+      @Component({
+        selector: 'my-app',
+        template: "<h1>Hello {{name}}</h1>",
+      })
+      export class AppComponent  {
+        name = 'Angular';
+
+        @MyValidationDecorator( TypeEnum.type, ValidationFunction({option: 'value'}))
+        myClassProp: number;
+    }`;
+    init(data);
+    const appComponent = reflector.getStaticSymbol(file, 'AppComponent');
+    expect(() => reflector.propMetadata(appComponent)).not.toThrow();
+  });
+
   describe('inheritance', () => {
     class ClassDecorator {
       constructor(public value: any) {}
@@ -487,6 +521,8 @@ describe('StaticReflector', () => {
             export class Child extends Parent {}
 
             export class ChildNoDecorators extends Parent {}
+
+            export class ChildInvalidParent extends a.InvalidParent {}
           `
       });
 
@@ -500,6 +536,10 @@ describe('StaticReflector', () => {
       expect(
           reflector.annotations(reflector.getStaticSymbol('/tmp/src/main.ts', 'ChildNoDecorators')))
           .toEqual([new ClassDecorator('parent')]);
+
+      expect(reflector.annotations(
+                 reflector.getStaticSymbol('/tmp/src/main.ts', 'ChildInvalidParent')))
+          .toEqual([]);
     });
 
     it('should inherit parameters', () => {
@@ -520,6 +560,8 @@ describe('StaticReflector', () => {
             export class ChildWithCtor extends Parent {
               constructor(@ParamDecorator('c') c: C) {}
             }
+
+            export class ChildInvalidParent extends a.InvalidParent {}
           `
       });
 
@@ -537,6 +579,10 @@ describe('StaticReflector', () => {
 
       expect(reflector.parameters(reflector.getStaticSymbol('/tmp/src/main.ts', 'ChildWithCtor')))
           .toEqual([[reflector.getStaticSymbol('/tmp/src/main.ts', 'C'), new ParamDecorator('c')]]);
+
+      expect(
+          reflector.parameters(reflector.getStaticSymbol('/tmp/src/main.ts', 'ChildInvalidParent')))
+          .toEqual([]);
     });
 
     it('should inherit property metadata', () => {
@@ -561,6 +607,8 @@ describe('StaticReflector', () => {
               @PropDecorator('c')
               c: C;
             }
+
+            export class ChildInvalidParent extends a.InvalidParent {}
           `
       });
 
@@ -577,6 +625,10 @@ describe('StaticReflector', () => {
             'b': [new PropDecorator('b1'), new PropDecorator('b2')],
             'c': [new PropDecorator('c')]
           });
+
+      expect(reflector.propMetadata(
+                 reflector.getStaticSymbol('/tmp/src/main.ts', 'ChildInvalidParent')))
+          .toEqual({});
     });
 
     it('should inherit lifecycle hooks', () => {
@@ -591,6 +643,8 @@ describe('StaticReflector', () => {
               hook2() {}
               hook3() {}
             }
+
+            export class ChildInvalidParent extends a.InvalidParent {}
           `
       });
 
@@ -606,6 +660,10 @@ describe('StaticReflector', () => {
       expect(hooks(reflector.getStaticSymbol('/tmp/src/main.ts', 'Child'), [
         'hook1', 'hook2', 'hook3'
       ])).toEqual([true, true, true]);
+
+      expect(hooks(reflector.getStaticSymbol('/tmp/src/main.ts', 'ChildInvalidParent'), [
+        'hook1', 'hook2', 'hook3'
+      ])).toEqual([false, false, false]);
     });
   });
 

modules/@angular/compiler/test/aot/static_symbol_resolver_spec.ts

@@ -16,7 +16,7 @@ import * as ts from 'typescript';
 const TS_EXT = /(^.|(?!\.d)..)\.ts$/;
 
 describe('StaticSymbolResolver', () => {
-  const noContext = new StaticSymbol('', '');
+  const noContext = new StaticSymbol('', '', []);
   let host: StaticSymbolResolverHost;
   let symbolResolver: StaticSymbolResolver;
   let symbolCache: StaticSymbolCache;
@@ -24,10 +24,11 @@ describe('StaticSymbolResolver', () => {
   beforeEach(() => { symbolCache = new StaticSymbolCache(); });
 
   function init(
-      testData: {[key: string]: any} = DEFAULT_TEST_DATA, summaries: Summary<StaticSymbol>[] = []) {
+      testData: {[key: string]: any} = DEFAULT_TEST_DATA, summaries: Summary<StaticSymbol>[] = [],
+      summaryImportAs: {symbol: StaticSymbol, importAs: StaticSymbol}[] = []) {
     host = new MockStaticSymbolResolverHost(testData);
-    symbolResolver =
-        new StaticSymbolResolver(host, symbolCache, new MockSummaryResolver(summaries));
+    symbolResolver = new StaticSymbolResolver(
+        host, symbolCache, new MockSummaryResolver(summaries, summaryImportAs));
   }
 
   beforeEach(() => init());
@@ -137,6 +138,73 @@ describe('StaticSymbolResolver', () => {
     ]);
   });
 
+  describe('importAs', () => {
+
+    it('should calculate importAs relationship for non source files without summaries', () => {
+      init(
+          {
+            '/test.d.ts': [{
+              '__symbolic': 'module',
+              'version': 3,
+              'metadata': {
+                'a': {'__symbolic': 'reference', 'name': 'b', 'module': './test2'},
+              }
+            }],
+            '/test2.d.ts': [{
+              '__symbolic': 'module',
+              'version': 3,
+              'metadata': {
+                'b': {'__symbolic': 'reference', 'name': 'c', 'module': './test3'},
+              }
+            }]
+          },
+          []);
+      symbolResolver.getSymbolsOf('/test.d.ts');
+      symbolResolver.getSymbolsOf('/test2.d.ts');
+
+      expect(symbolResolver.getImportAs(symbolCache.get('/test2.d.ts', 'b')))
+          .toBe(symbolCache.get('/test.d.ts', 'a'));
+      expect(symbolResolver.getImportAs(symbolCache.get('/test3.d.ts', 'c')))
+          .toBe(symbolCache.get('/test.d.ts', 'a'));
+    });
+
+    it('should calculate importAs relationship for non source files with summaries', () => {
+      init(
+          {
+            '/test.ts': `
+          export {a} from './test2';
+        `
+          },
+          [], [{
+            symbol: symbolCache.get('/test2.d.ts', 'a'),
+            importAs: symbolCache.get('/test3.d.ts', 'b')
+          }]);
+      symbolResolver.getSymbolsOf('/test.ts');
+
+      expect(symbolResolver.getImportAs(symbolCache.get('/test2.d.ts', 'a')))
+          .toBe(symbolCache.get('/test3.d.ts', 'b'));
+    });
+
+    it('should calculate importAs for symbols with members based on importAs for symbols without',
+       () => {
+         init(
+             {
+               '/test.ts': `
+          export {a} from './test2';
+        `
+             },
+             [], [{
+               symbol: symbolCache.get('/test2.d.ts', 'a'),
+               importAs: symbolCache.get('/test3.d.ts', 'b')
+             }]);
+         symbolResolver.getSymbolsOf('/test.ts');
+
+         expect(symbolResolver.getImportAs(symbolCache.get('/test2.d.ts', 'a', ['someMember'])))
+             .toBe(symbolCache.get('/test3.d.ts', 'b', ['someMember']));
+       });
+
+  });
+
   it('should replace references by StaticSymbols', () => {
     init({
       '/test.ts': `
@@ -180,6 +248,42 @@ describe('StaticSymbolResolver', () => {
         .toBeFalsy();
   });
 
+  it('should fill references to ambient symbols with undefined', () => {
+    init({
+      '/test.ts': `
+        export var y = 1;
+        export var z = [window, z];
+      `
+    });
+
+    expect(symbolResolver.resolveSymbol(symbolCache.get('/test.ts', 'z')).metadata).toEqual([
+      undefined, symbolCache.get('/test.ts', 'z')
+    ]);
+  });
+
+  it('should allow to use symbols with __', () => {
+    init({
+      '/test.ts': `
+        export {__a__ as __b__} from './test2';
+        import {__c__} from './test2';
+
+        export var __x__ = 1;
+        export var __y__ = __c__;
+      `
+    });
+
+    expect(symbolResolver.resolveSymbol(symbolCache.get('/test.ts', '__x__')).metadata).toBe(1);
+    expect(symbolResolver.resolveSymbol(symbolCache.get('/test.ts', '__y__')).metadata)
+        .toBe(symbolCache.get('/test2.d.ts', '__c__'));
+    expect(symbolResolver.resolveSymbol(symbolCache.get('/test.ts', '__b__')).metadata)
+        .toBe(symbolCache.get('/test2.d.ts', '__a__'));
+
+    expect(symbolResolver.getSymbolsOf('/test.ts')).toEqual([
+      symbolCache.get('/test.ts', '__x__'), symbolCache.get('/test.ts', '__y__'),
+      symbolCache.get('/test.ts', '__b__')
+    ]);
+  });
+
   it('should be able to trace a named export', () => {
     const symbol = symbolResolver
                        .resolveSymbol(symbolResolver.getSymbolByModule(
@@ -240,7 +344,10 @@ describe('StaticSymbolResolver', () => {
 });
 
 export class MockSummaryResolver implements SummaryResolver<StaticSymbol> {
-  constructor(private summaries: Summary<StaticSymbol>[] = []) {}
+  constructor(private summaries: Summary<StaticSymbol>[] = [], private importAs: {
+    symbol: StaticSymbol,
+    importAs: StaticSymbol
+  }[] = []) {}
 
   resolveSummary(reference: StaticSymbol): Summary<StaticSymbol> {
     return this.summaries.find(summary => summary.symbol === reference);
@@ -249,6 +356,13 @@ export class MockSummaryResolver implements SummaryResolver<StaticSymbol> {
     return this.summaries.filter(summary => summary.symbol.filePath === filePath)
         .map(summary => summary.symbol);
   }
+  getImportAs(symbol: StaticSymbol): StaticSymbol {
+    const entry = this.importAs.find(entry => entry.symbol === symbol);
+    return entry ? entry.importAs : undefined;
+  }
+
+  isLibraryFile(filePath: string): boolean { return filePath.endsWith('.d.ts'); }
+  getLibraryFileName(filePath: string): string { return filePath.replace(/(\.d)?\.ts$/, '.d.ts'); }
 }
 
 export class MockStaticSymbolResolverHost implements StaticSymbolResolverHost {

modules/@angular/compiler/test/aot/summary_resolver_spec.ts

@@ -7,12 +7,12 @@
  */
 
 import {AotSummaryResolver, AotSummaryResolverHost, CompileSummaryKind, CompileTypeSummary, ResolvedStaticSymbol, StaticSymbol, StaticSymbolCache, StaticSymbolResolver} from '@angular/compiler';
-import {AotSummarySerializerHost, deserializeSummaries, serializeSummaries} from '@angular/compiler/src/aot/summary_serializer';
+import {deserializeSummaries, serializeSummaries} from '@angular/compiler/src/aot/summary_serializer';
 import * as path from 'path';
 
 import {MockStaticSymbolResolverHost, MockSummaryResolver} from './static_symbol_resolver_spec';
 
-const EXT = /\.ts$|.d.ts$/;
+const EXT = /(\.d)?\.ts$/;
 
 export function main() {
   describe('AotSummaryResolver', () => {
@@ -32,8 +32,7 @@ export function main() {
       const mockSummaryResolver = new MockSummaryResolver([]);
       const symbolResolver = new StaticSymbolResolver(
           new MockStaticSymbolResolverHost({}), symbolCache, mockSummaryResolver);
-      return serializeSummaries(
-          new MockAotSummarySerializerHost(), mockSummaryResolver, symbolResolver, symbols, types);
+      return serializeSummaries(mockSummaryResolver, symbolResolver, symbols, types).json;
     }
 
     it('should load serialized summary files', () => {
@@ -56,17 +55,48 @@ export function main() {
       expect(summaryResolver.resolveSummary(asymbol)).toBe(summaryResolver.resolveSummary(asymbol));
     });
 
-    it('should return all sumbols in a summary', () => {
+    it('should return all symbols in a summary', () => {
       const asymbol = symbolCache.get('/a.d.ts', 'a');
       init({'/a.ngsummary.json': serialize([{symbol: asymbol, metadata: 1}], [])});
       expect(summaryResolver.getSymbolsOf('/a.d.ts')).toEqual([asymbol]);
+    });
 
+    it('should fill importAs for deep symbols', () => {
+      const libSymbol = symbolCache.get('/lib.d.ts', 'Lib');
+      const srcSymbol = symbolCache.get('/src.ts', 'Src');
+      init({
+        '/src.ngsummary.json':
+            serialize([{symbol: srcSymbol, metadata: 1}, {symbol: libSymbol, metadata: 2}], [])
+      });
+      summaryResolver.getSymbolsOf('/src.d.ts');
+
+      expect(summaryResolver.getImportAs(symbolCache.get('/src.d.ts', 'Src'))).toBeFalsy();
+      expect(summaryResolver.getImportAs(libSymbol))
+          .toBe(symbolCache.get('/src.ngfactory.ts', 'Lib_1'));
+    });
+
+    describe('isLibraryFile', () => {
+      it('should use host.isSourceFile to calculate the result', () => {
+        init();
+        expect(summaryResolver.isLibraryFile('someFile.ts')).toBe(false);
+        expect(summaryResolver.isLibraryFile('someFile.d.ts')).toBe(true);
+      });
+
+      it('should calculate the result for generated files based on the result for non generated files',
+         () => {
+           init();
+           spyOn(host, 'isSourceFile').and.callThrough();
+           expect(summaryResolver.isLibraryFile('someFile.ngfactory.ts')).toBe(false);
+           expect(host.isSourceFile).toHaveBeenCalledWith('someFile.ts');
+         });
     });
   });
 }
 
 
-export class MockAotSummarySerializerHost implements AotSummarySerializerHost {
+export class MockAotSummaryResolverHost implements AotSummaryResolverHost {
+  constructor(private summaries: {[fileName: string]: string}) {}
+
   fileNameToModuleName(fileName: string): string {
     return './' + path.basename(fileName).replace(EXT, '');
   }
@@ -76,11 +106,6 @@ export class MockAotSummarySerializerHost implements AotSummarySerializerHost {
   }
 
   isSourceFile(filePath: string) { return !filePath.endsWith('.d.ts'); }
-}
-
-export class MockAotSummaryResolverHost extends MockAotSummarySerializerHost implements
-    AotSummaryResolverHost {
-  constructor(private summaries: {[fileName: string]: string}) { super(); }
 
   loadSummary(filePath: string): string { return this.summaries[filePath]; }
 }

modules/@angular/compiler/test/aot/summary_serializer_spec.ts

@@ -7,7 +7,8 @@
  */
 
 import {AotSummaryResolver, AotSummaryResolverHost, CompileSummaryKind, StaticSymbol, StaticSymbolCache, StaticSymbolResolver, StaticSymbolResolverHost} from '@angular/compiler';
-import {AotSummarySerializerHost, deserializeSummaries, serializeSummaries, summaryFileName} from '@angular/compiler/src/aot/summary_serializer';
+import {deserializeSummaries, serializeSummaries} from '@angular/compiler/src/aot/summary_serializer';
+import {summaryFileName} from '@angular/compiler/src/aot/util';
 
 import {MockStaticSymbolResolverHost} from './static_symbol_resolver_spec';
 import {MockAotSummaryResolverHost} from './summary_resolver_spec';
@@ -42,7 +43,7 @@ export function main() {
     it('should serialize various data correctly', () => {
       init();
       const serializedData = serializeSummaries(
-          host, summaryResolver, symbolResolver,
+          summaryResolver, symbolResolver,
           [
             {
               symbol: symbolCache.get('/tmp/some_values.ts', 'Values'),
@@ -50,7 +51,9 @@ export function main() {
                 aNumber: 1,
                 aString: 'hello',
                 anArray: [1, 2],
-                aStaticSymbol: symbolCache.get('/tmp/some_symbol.ts', 'someName')
+                aStaticSymbol: symbolCache.get('/tmp/some_symbol.ts', 'someName'),
+                aStaticSymbolWithMembers:
+                    symbolCache.get('/tmp/some_symbol.ts', 'someName', ['someMember']),
               }
             },
             {
@@ -66,11 +69,11 @@ export function main() {
             summaryKind: CompileSummaryKind.Injectable,
             type: {
               reference: symbolCache.get('/tmp/some_service.ts', 'SomeService'),
-            },
+            }
           }]);
 
 
-      const summaries = deserializeSummaries(symbolCache, serializedData);
+      const summaries = deserializeSummaries(symbolCache, serializedData.json).summaries;
       expect(summaries.length).toBe(2);
 
       // Note: change from .ts to .d.ts is expected
@@ -79,7 +82,9 @@ export function main() {
         aNumber: 1,
         aString: 'hello',
         anArray: [1, 2],
-        aStaticSymbol: symbolCache.get('/tmp/some_symbol.d.ts', 'someName')
+        aStaticSymbol: symbolCache.get('/tmp/some_symbol.d.ts', 'someName'),
+        aStaticSymbolWithMembers:
+            symbolCache.get('/tmp/some_symbol.d.ts', 'someName', ['someMember'])
       });
 
       expect(summaries[1].symbol).toBe(symbolCache.get('/tmp/some_service.d.ts', 'SomeService'));
@@ -91,8 +96,8 @@ export function main() {
 
     it('should automatically add exported directives / pipes of NgModules that are not source files',
        () => {
-         init({});
-         const externalSerialized = serializeSummaries(host, summaryResolver, symbolResolver, [], [
+         init();
+         const externalSerialized = serializeSummaries(summaryResolver, symbolResolver, [], [
            <any>{
              summaryKind: CompileSummaryKind.Pipe,
              type: {
@@ -107,11 +112,11 @@ export function main() {
            }
          ]);
          init({
-           '/tmp/external.ngsummary.json': externalSerialized,
+           '/tmp/external.ngsummary.json': externalSerialized.json,
          });
 
          const serialized = serializeSummaries(
-             host, summaryResolver, symbolResolver, [], [<any>{
+             summaryResolver, symbolResolver, [], [<any>{
                summaryKind: CompileSummaryKind.NgModule,
                type: {reference: symbolCache.get('/tmp/some_module.ts', 'SomeModule')},
                exportedPipes: [
@@ -124,7 +129,7 @@ export function main() {
                ]
              }]);
 
-         const summaries = deserializeSummaries(symbolCache, serialized);
+         const summaries = deserializeSummaries(symbolCache, serialized.json).summaries;
          expect(summaries.length).toBe(3);
          expect(summaries[0].symbol).toBe(symbolCache.get('/tmp/some_module.d.ts', 'SomeModule'));
          expect(summaries[1].symbol).toBe(symbolCache.get('/tmp/external.d.ts', 'SomeExternalDir'));
@@ -134,8 +139,9 @@ export function main() {
 
     it('should automatically add the metadata of referenced symbols that are not in the soure files',
        () => {
+         init();
          const externalSerialized = serializeSummaries(
-             host, summaryResolver, symbolResolver,
+             summaryResolver, symbolResolver,
              [
                {
                  symbol: symbolCache.get('/tmp/external.ts', 'PROVIDERS'),
@@ -154,7 +160,7 @@ export function main() {
              }]);
          init(
              {
-               '/tmp/external.ngsummary.json': externalSerialized,
+               '/tmp/external.ngsummary.json': externalSerialized.json,
              },
              {
                '/tmp/local.ts': `
@@ -164,7 +170,7 @@ export function main() {
                    {__symbolic: 'module', version: 3, metadata: {'external': 'b'}}
              });
          const serialized = serializeSummaries(
-             host, summaryResolver, symbolResolver, [{
+             summaryResolver, symbolResolver, [{
                symbol: symbolCache.get('/tmp/test.ts', 'main'),
                metadata: {
                  local: symbolCache.get('/tmp/local.ts', 'local'),
@@ -174,7 +180,7 @@ export function main() {
              }],
              []);
 
-         const summaries = deserializeSummaries(symbolCache, serialized);
+         const summaries = deserializeSummaries(symbolCache, serialized.json).summaries;
          // Note: local should not show up!
          expect(summaries.length).toBe(4);
          expect(summaries[0].symbol).toBe(symbolCache.get('/tmp/test.d.ts', 'main'));
@@ -195,5 +201,28 @@ export function main() {
          expect(summaries[3].type.type.reference)
              .toBe(symbolCache.get('/tmp/external_svc.d.ts', 'SomeService'));
        });
+
+    it('should create "importAs" names for non source symbols', () => {
+      init();
+      const serialized = serializeSummaries(
+          summaryResolver, symbolResolver, [{
+            symbol: symbolCache.get('/tmp/test.ts', 'main'),
+            metadata: [
+              symbolCache.get('/tmp/external.d.ts', 'lib'),
+              symbolCache.get('/tmp/external.d.ts', 'lib', ['someMember']),
+            ]
+          }],
+          []);
+      // Note: no entry for the symbol with members!
+      expect(serialized.exportAs).toEqual([
+        {symbol: symbolCache.get('/tmp/external.d.ts', 'lib'), exportAs: 'lib_1'}
+      ]);
+
+      const deserialized = deserializeSummaries(symbolCache, serialized.json);
+      // Note: no entry for the symbol with members!
+      expect(deserialized.importAs).toEqual([
+        {symbol: symbolCache.get('/tmp/external.d.ts', 'lib'), importAs: 'lib_1'}
+      ]);
+    });
   });
 }

modules/@angular/compiler/test/directive_normalizer_spec.ts

@@ -33,6 +33,22 @@ export function main() {
              moduleUrl: SOME_MODULE_URL,
            })).toThrowError(SyntaxError, 'No template specified for component SomeComp');
          }));
+      it('should throw if template is not a string',
+         inject([DirectiveNormalizer], (normalizer: DirectiveNormalizer) => {
+           expect(
+               () => normalizer.normalizeTemplate(
+                   {componentType: SomeComp, moduleUrl: SOME_MODULE_URL, template: <any>{}}))
+               .toThrowError(
+                   SyntaxError, 'The template specified for component SomeComp is not a string');
+         }));
+      it('should throw if templateUrl is not a string',
+         inject([DirectiveNormalizer], (normalizer: DirectiveNormalizer) => {
+           expect(
+               () => normalizer.normalizeTemplate(
+                   {componentType: SomeComp, moduleUrl: SOME_MODULE_URL, templateUrl: <any>{}}))
+               .toThrowError(
+                   SyntaxError, 'The templateUrl specified for component SomeComp is not a string');
+         }));
     });
 
     describe('normalizeTemplateSync', () => {
@@ -535,4 +551,4 @@ function programResourceLoaderSpy(spy: SpyResourceLoader, results: {[key: string
   });
 }
 
-class SomeComp {}
+class SomeComp {}

modules/@angular/compiler/test/i18n/integration_spec.ts

@@ -8,6 +8,10 @@
 
 import {NgLocalization} from '@angular/common';
 import {ResourceLoader} from '@angular/compiler';
+import {MessageBundle} from '@angular/compiler/src/i18n/message_bundle';
+import {Xmb} from '@angular/compiler/src/i18n/serializers/xmb';
+import {HtmlParser} from '@angular/compiler/src/ml_parser/html_parser';
+import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/interpolation_config';
 import {Component, DebugElement, TRANSLATIONS, TRANSLATIONS_FORMAT} from '@angular/core';
 import {TestBed, async} from '@angular/core/testing';
 import {By} from '@angular/platform-browser/src/dom/debug/by';
@@ -32,9 +36,16 @@ export function main() {
       TestBed.configureTestingModule({declarations: [I18nComponent]});
     }));
 
+    it('should extract from templates', () => {
+      const catalog = new MessageBundle(new HtmlParser, [], {});
+      const serializer = new Xmb();
+      catalog.updateFromTemplate(HTML, '', DEFAULT_INTERPOLATION_CONFIG);
 
-    it('translate templates', () => {
-      const tb = TestBed.createComponent(I18nComponent);
+      expect(catalog.write(serializer)).toContain(XMB);
+    });
+
+    it('should translate templates', () => {
+      const tb = TestBed.overrideTemplate(I18nComponent, HTML).createComponent(I18nComponent);
       const cmp = tb.componentInstance;
       const el = tb.debugElement;
 
@@ -95,6 +106,8 @@ export function main() {
           .toBe('<div id="i18n-13" title="dans une section traductible"></div>');
       expectHtml(el, '#i18n-15').toMatch(/ca <b>devrait<\/b> marcher/);
       expectHtml(el, '#i18n-16').toMatch(/avec un ID explicite/);
+      expectHtml(el, '#i18n-18')
+          .toEqual('<div id="i18n-18">FOO<a title="dans une section traductible">BAR</a></div>');
     });
   });
 }
@@ -105,53 +118,13 @@ function expectHtml(el: DebugElement, cssSelector: string): any {
 
 @Component({
   selector: 'i18n-cmp',
-  template: `
-<div>
-    <h1 i18n>i18n attribute on tags</h1>
-    
-    <div id="i18n-1"><p i18n>nested</p></div>
-    
-    <div id="i18n-2"><p i18n="different meaning|">nested</p></div>
-    
-    <div id="i18n-3"><p i18n><i>with placeholders</i></p></div>
-    <div id="i18n-3b"><p i18n><i class="preserved-on-placeholders">with placeholders</i></p></div>
-    
-    <div>
-        <p id="i18n-4" i18n-title title="on not translatable node"></p>
-        <p id="i18n-5" i18n i18n-title title="on translatable node"></p>
-        <p id="i18n-6" i18n-title title></p>
-    </div>
-    
-    <!-- no ph below because the ICU node is the only child of the div, i.e. no text nodes --> 
-    <div i18n id="i18n-7">{count, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>}}</div>
-    
-    <div i18n id="i18n-8">
-        {sex, select, m {male} f {female}}
-    </div>
-    <div i18n id="i18n-8b">
-        {sexB, select, m {male} f {female}}
-    </div>
-    
-    <div i18n id="i18n-9">{{ "count = " + count }}</div>
-    <div i18n id="i18n-10">sex = {{ sex }}</div>
-    <div i18n id="i18n-11">{{ "custom name" //i18n(ph="CUSTOM_NAME") }}</div>    
-</div>
-
-<!-- i18n -->
-    <h1 id="i18n-12" >Markers in html comments</h1>   
-    <div id="i18n-13" i18n-title title="in a translatable section"></div>
-    <div id="i18n-14">{count, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>}}</div>
-<!-- /i18n -->
-
-<div id="i18n-15"><ng-container i18n>it <b>should</b> work</ng-container></div>
-<div id="i18n-16" i18n="@@i18n16">with an explicit ID</div>
-<div id="i18n-17" i18n="@@i18n17">{count, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>}}</div>
-`
+  template: '',
 })
 class I18nComponent {
   count: number;
   sex: string;
   sexB: string;
+  response: any = {getItemsList: (): any[] => []};
 }
 
 class FrLocalization extends NgLocalization {
@@ -190,14 +163,11 @@ const XTB = `
   <translation id="i18n16">avec un ID explicite</translation>
   <translation id="i18n17">{VAR_PLURAL, plural, =0 {zero} =1 {un} =2 {deux} other {<ph 
   name="START_BOLD_TEXT"><ex>&lt;b&gt;</ex></ph>beaucoup<ph name="CLOSE_BOLD_TEXT"><ex>&lt;/b&gt;</ex></ph>} }</translation>
+  <translation id="4085484936881858615">{VAR_PLURAL, plural, =0 {Pas de réponse} =1 {une réponse} other {<ph name="INTERPOLATION"><ex>INTERPOLATION</ex></ph> réponse} }</translation>
+  <translation id="4035252431381981115">FOO<ph name="START_LINK"><ex>&lt;a&gt;</ex></ph>BAR<ph name="CLOSE_LINK"><ex>&lt;/a&gt;</ex></ph></translation>
 </translationbundle>`;
 
-// unused, for reference only
-// can be generated from xmb_spec as follow:
-// `fit('extract xmb', () => { console.log(toXmb(HTML)); });`
-const XMB = `
-<messagebundle>
-  <msg id="615790887472569365">i18n attribute on tags</msg>
+const XMB = ` <msg id="615790887472569365">i18n attribute on tags</msg>
   <msg id="3707494640264351337">nested</msg>
   <msg id="5539162898278769904" meaning="different meaning">nested</msg>
   <msg id="3780349238193953556"><ph name="START_ITALIC_TEXT"><ex>&lt;i&gt;</ex></ph>with placeholders<ph name="CLOSE_ITALIC_TEXT"><ex>&lt;/i&gt;</ex></ph></msg>
@@ -205,20 +175,75 @@ const XMB = `
   <msg id="8670732454866344690">on translatable node</msg>
   <msg id="4593805537723189714">{VAR_PLURAL, plural, =0 {zero} =1 {one} =2 {two} other {<ph name="START_BOLD_TEXT"><ex>&lt;b&gt;</ex></ph>many<ph name="CLOSE_BOLD_TEXT"><ex>&lt;/b&gt;</ex></ph>} }</msg>
   <msg id="1746565782635215">
-        <ph name="ICU"/>
+        <ph name="ICU"><ex>ICU</ex></ph>
     </msg>
   <msg id="5868084092545682515">{VAR_SELECT, select, m {male} f {female} }</msg>
-  <msg id="4851788426695310455"><ph name="INTERPOLATION"/></msg>
-  <msg id="9013357158046221374">sex = <ph name="INTERPOLATION"/></msg>
-  <msg id="8324617391167353662"><ph name="CUSTOM_NAME"/></msg>
+  <msg id="4851788426695310455"><ph name="INTERPOLATION"><ex>INTERPOLATION</ex></ph></msg>
+  <msg id="9013357158046221374">sex = <ph name="INTERPOLATION"><ex>INTERPOLATION</ex></ph></msg>
+  <msg id="8324617391167353662"><ph name="CUSTOM_NAME"><ex>CUSTOM_NAME</ex></ph></msg>
   <msg id="7685649297917455806">in a translatable section</msg>
   <msg id="2387287228265107305">
     <ph name="START_HEADING_LEVEL1"><ex>&lt;h1&gt;</ex></ph>Markers in html comments<ph name="CLOSE_HEADING_LEVEL1"><ex>&lt;/h1&gt;</ex></ph>   
     <ph name="START_TAG_DIV"><ex>&lt;div&gt;</ex></ph><ph name="CLOSE_TAG_DIV"><ex>&lt;/div&gt;</ex></ph>
-    <ph name="START_TAG_DIV_1"><ex>&lt;div&gt;</ex></ph><ph name="ICU"/><ph name="CLOSE_TAG_DIV"><ex>&lt;/div&gt;</ex></ph>
+    <ph name="START_TAG_DIV_1"><ex>&lt;div&gt;</ex></ph><ph name="ICU"><ex>ICU</ex></ph><ph name="CLOSE_TAG_DIV"><ex>&lt;/div&gt;</ex></ph>
 </msg>
   <msg id="1491627405349178954">it <ph name="START_BOLD_TEXT"><ex>&lt;b&gt;</ex></ph>should<ph name="CLOSE_BOLD_TEXT"><ex>&lt;/b&gt;</ex></ph> work</msg>
   <msg id="i18n16">with an explicit ID</msg>
   <msg id="i18n17">{VAR_PLURAL, plural, =0 {zero} =1 {one} =2 {two} other {<ph name="START_BOLD_TEXT"><ex>&lt;b&gt;</ex></ph>many<ph name="CLOSE_BOLD_TEXT"><ex>&lt;/b&gt;</ex></ph>} }</msg>
-</messagebundle>
+  <msg id="4085484936881858615" desc="desc">{VAR_PLURAL, plural, =0 {Found no results} =1 {Found one result} other {Found <ph name="INTERPOLATION"><ex>INTERPOLATION</ex></ph> results} }</msg>
+  <msg id="4035252431381981115">foo<ph name="START_LINK"><ex>&lt;a&gt;</ex></ph>bar<ph name="CLOSE_LINK"><ex>&lt;/a&gt;</ex></ph></msg>`;
+
+const HTML = `
+<div>
+    <h1 i18n>i18n attribute on tags</h1>
+    
+    <div id="i18n-1"><p i18n>nested</p></div>
+    
+    <div id="i18n-2"><p i18n="different meaning|">nested</p></div>
+    
+    <div id="i18n-3"><p i18n><i>with placeholders</i></p></div>
+    <div id="i18n-3b"><p i18n><i class="preserved-on-placeholders">with placeholders</i></p></div>
+    
+    <div>
+        <p id="i18n-4" i18n-title title="on not translatable node"></p>
+        <p id="i18n-5" i18n i18n-title title="on translatable node"></p>
+        <p id="i18n-6" i18n-title title></p>
+    </div>
+    
+    <!-- no ph below because the ICU node is the only child of the div, i.e. no text nodes --> 
+    <div i18n id="i18n-7">{count, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>}}</div>
+    
+    <div i18n id="i18n-8">
+        {sex, select, m {male} f {female}}
+    </div>
+    <div i18n id="i18n-8b">
+        {sexB, select, m {male} f {female}}
+    </div>
+    
+    <div i18n id="i18n-9">{{ "count = " + count }}</div>
+    <div i18n id="i18n-10">sex = {{ sex }}</div>
+    <div i18n id="i18n-11">{{ "custom name" //i18n(ph="CUSTOM_NAME") }}</div>    
+</div>
+
+<!-- i18n -->
+    <h1 id="i18n-12" >Markers in html comments</h1>   
+    <div id="i18n-13" i18n-title title="in a translatable section"></div>
+    <div id="i18n-14">{count, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>}}</div>
+<!-- /i18n -->
+
+<div id="i18n-15"><ng-container i18n>it <b>should</b> work</ng-container></div>
+
+<div id="i18n-16" i18n="@@i18n16">with an explicit ID</div>
+<div id="i18n-17" i18n="@@i18n17">{count, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>}}</div>
+
+<!-- make sure that ICU messages are not treated as text nodes -->
+<div i18n="desc">{
+    response.getItemsList().length,
+    plural,
+    =0 {Found no results}
+    =1 {Found one result}
+    other {Found {{response.getItemsList().length}} results}
+}</div>
+
+<div i18n id="i18n-18">foo<a i18n-title title="in a translatable section">bar</a></div>
 `;

modules/@angular/compiler/test/integration_spec.ts

@@ -0,0 +1,51 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import {Component, Directive, Input} from '@angular/core';
+import {ComponentFixture, TestBed, async} from '@angular/core/testing';
+import {By} from '@angular/platform-browser/src/dom/debug/by';
+import {expect} from '@angular/platform-browser/testing/matchers';
+
+export function main() {
+  describe('integration tests', () => {
+    let fixture: ComponentFixture<TestComponent>;
+
+
+    describe('directives', () => {
+      it('should support dotted selectors', async(() => {
+           @Directive({selector: '[dot.name]'})
+           class MyDir {
+             @Input('dot.name') value: string;
+           }
+
+           TestBed.configureTestingModule({
+             declarations: [
+               MyDir,
+               TestComponent,
+             ],
+           });
+
+           const template = `<div [dot.name]="'foo'"></div>`;
+           fixture = createTestComponent(template);
+           fixture.detectChanges();
+           const myDir = fixture.debugElement.query(By.directive(MyDir)).injector.get(MyDir);
+           expect(myDir.value).toEqual('foo');
+         }));
+    });
+
+  });
+}
+
+@Component({selector: 'test-cmp', template: ''})
+class TestComponent {
+}
+
+function createTestComponent(template: string): ComponentFixture<TestComponent> {
+  return TestBed.overrideComponent(TestComponent, {set: {template: template}})
+      .createComponent(TestComponent);
+}

modules/@angular/compiler/test/metadata_resolver_spec.ts

@@ -222,6 +222,27 @@ export function main() {
                  SyntaxError, `Can't resolve all parameters for NonAnnotatedService: (?).`);
        }));
 
+    it('should throw with descriptive error message when encounter invalid provider',
+       inject([CompileMetadataResolver], (resolver: CompileMetadataResolver) => {
+         @NgModule({providers: [{provide: SimpleService, useClass: undefined}]})
+         class SomeModule {
+         }
+
+         expect(() => resolver.loadNgModuleDirectiveAndPipeMetadata(SomeModule, true))
+             .toThrowError(
+                 SyntaxError, /Invalid provider for SimpleService. useClass cannot be undefined./);
+       }));
+
+    it('should throw with descriptive error message when provider is undefined',
+       inject([CompileMetadataResolver], (resolver: CompileMetadataResolver) => {
+         @NgModule({providers: [undefined]})
+         class SomeModule {
+         }
+
+         expect(() => resolver.loadNgModuleDirectiveAndPipeMetadata(SomeModule, true))
+             .toThrowError(SyntaxError, /Encountered undefined provider!/);
+       }));
+
     it('should throw with descriptive error message when one of providers is not present',
        inject([CompileMetadataResolver], (resolver: CompileMetadataResolver) => {
          @NgModule({declarations: [MyBrokenComp3]})