Previously, the relative order of the AngularJS compiling/linking operations was
not similar to AngularJS's, resulting in inconsistent behavior for upgraded
components (which made upgrading to Angular less straight forward).
This commit fixes it, by following the compiling/linking process of AngularJS
more closely.
Main differences:
- The components view is already populated when the controller is instantiated
(and subsequent hooks are called).
- The correct DOM content is available when running the `$onChanges`, `$onInit`,
`$doCheck` hooks. Previously, the "content children" were still present, not
the "view children".
- The same for pre-linking.
- The template is compiled in the correct DOM context (e.g. has access to
ancestors). Previously, it was compiled in isolation, inside a dummy element.
For reference, here is the order of operations:
**Before**
1. Compile template
2. Instantiate controller
3. Hook: $onChanges
4. Hook: $onInit
5. Hook: $doCheck
6. Pre-linking
7. Collect content children
8. Insert compiled template
9. Linking
10. Post-linking
11. Hook: $postLink
**After**
1. Collect content children
2. Insert template
3. Compile template
4. Instantiate controller
5. Hook: $onChanges
6. Hook: $onInit
7. Hook: $doCheck
8. Pre-linking
9. Linking
10. Post-linking
11. Hook: $postLink
Fixes#13912
Secondary entry points (testing, static, etc) are rolled up into a
single ESM/ES2015 file, then downleveled to ESM/ES2015. This downleveling
was not working and was producing ESM/ES2015. Also, the @angular/core
package's .babelrc file was missing reference to Rx Observable which
broke the UMD bundle.
Fixes#14730
After the introduction of the view engine, we can drop a lot of code that is not used any more.
This should reduce the size of the app bundles because a lot of this code was not being properly tree-shaken by today's tools even though it was dead code.
E.g. for no view encapsulation, the delegate will always be the same.
Nevertheless, we still need to create a new `AnimationRenderer` per
component.
Attention: This change will conflict with a local mod in G3.
- Don’t use the animation renderer if a component
used style encapsulation but no animations.
- The `AnimationRenderer` should be cached in the same
lifecycle as its delegate.
- Trigger names need to be namespaced per component type.
When the `enableLegacyTemplate` is set to `false`, `<template>` tags and the
`template` attribute are no more used to define angular templates but are
treated as regular tag and attribute.
The default value is `true`.
In order to define a template, you have to use the `<ng-template>` tag.
This option applies to your application and all the libraries it uses. That is
you should make sure none of them rely on the legacy way to defined templates
when this option is turned off (`false`).
The rationale of this change is to improve the inter-operability with web
components that might make use of the `<template>` tag.
DEPRECATION
The template tags and template attribute are deprecated:
<template ngFor [ngFor]=items let-item><li>...</li></template>
<li template="ngFor: let item of items">...</li>
should be rewritten as:
<ng-template ngFor [ngFor]=items let-item><li>...</li></ng-template>
Note that they still be supported in 4.x with a deprecartion warning in
development mode.
MIGRATION
- `template` tags (or elements with a `template` attribute) should be rewritten
as a `ng-template` tag,
- `ng-content` selectors should be updated to referto a `ng-template` where they
use to refer to a template: `<ng-content selector="template[attr]">` should be
rewritten as `<ng-content selector="ng-template[attr]">`
- if you consume a component relying on your templates being actual `template`
elements (that is they include a `<ng-content selector="template[attr]">`). You
should still migrate to `ng-template` and make use of `ngProjectAs` to override
the way `ng-content` sees the template:
`<ng-template projectAs="template[attr]">`
- while `template` elements are deprecated in 4.x they continue to work.
BREAKING CHANGE: Because all lifecycle hooks are now interfaces
the code that uses 'extends' keyword will no longer compile.
To migrate the code follow the example below:
Before:
```
@Component()
class SomeComponent extends OnInit {}
```
After:
```
@Component()
class SomeComponent implements OnInit {}
```
we don't expect anyone to be affected by this change.
Closes#10083
George Kalpakas
Tobias Bosch
Dzmitry Shylovich
Miško Hevery
Igor Minar
Igor Minar
Matias Niemelä
Jason Aden
Chuck Jazdzewski
vikerman
Victor Berchet
Martin Probst
Marc Laval