- prevents unsubscribing from the zone on error
- prevents unsubscribing from directive `EventEmitter`s on error
- prevents detaching views in dev mode if there on error
- ensures that `ngOnInit` is only called 1x (also in prod mode)
Fixes#9531Fixes#2413Fixes#15925
The Router use the type `Params` for all of:
- position parameters,
- matrix parameters,
- query parameters.
`Params` is defined as follow `type Params = {[key: string]: any}`
Because parameters can either have single or multiple values, the type should
actually be `type Params = {[key: string]: string | string[]}`.
The client code often assumes that parameters have single values, as in the
following exemple:
```
class MyComponent {
sessionId: Observable<string>;
constructor(private route: ActivatedRoute) {}
ngOnInit() {
this.sessionId = this.route
.queryParams
.map(params => params['session_id'] || 'None');
}
}
```
The problem here is that `params['session_id']` could be `string` or `string[]`
but the error is not caught at build time because of the `any` type.
Fixing the type as describe above would break the build because `sessionId`
would becomes an `Observable<string | string[]>`.
However the client code knows if it expects a single or multiple values. By
using the new `ParamMap` interface the user code can decide when it needs a
single value (calling `ParamMap.get(): string`) or multiple values (calling
`ParamMap.getAll(): string[]`).
The above exemple should be rewritten as:
```
class MyComponent {
sessionId: Observable<string>;
constructor(private route: ActivatedRoute) {}
ngOnInit() {
this.sessionId = this.route
.queryParamMap
.map(paramMap => paramMap.get('session_id') || 'None');
}
}
```
Added APIs:
- `interface ParamMap`,
- `ActivatedRoute.paramMap: ParamMap`,
- `ActivatedRoute.queryParamMap: ParamMap`,
- `ActivatedRouteSnapshot.paramMap: ParamMap`,
- `ActivatedRouteSnapshot.queryParamMap: ParamMap`,
- `UrlSegment.parameterMap: ParamMap`
E.g. for a component like this:
```
@Component({
template: ‘<ng-content select=“child”></ng-content>’
})
class MyComp {
@Input(‘aInputName’)
aInputProp: string;
@Output(‘aEventName’)
aOuputProp: EventEmitter<any>;
}
```
the `ComponentFactory` will now contain the following:
- `inputs = {aInputProp: ‘aInputName’}`
- `outputs = {aOutputProp: ‘aOutputName’}`
- `ngContentSelectors = [‘child’]`
E.g. for a component like this:
```
@Component({
template: ‘<ng-content select=“child”></ng-content>’
})
class MyComp {
@Input(‘aInputName’)
aInputProp: string;
@Output(‘aEventName’)
aOuputProp: EventEmitter<any>;
}
```
the `ComponentFactory` will now contain the following:
- `inputs = {aInputProp: ‘aInputName’}`
- `outputs = {aOutputProp: ‘aOutputName’}`
- `ngContentSelectors = [‘child’]`
fixes#12869fixes#12889fixes#13885fixes#13870
Before this change there was a single injector tree.
Now we have 2 injector trees, one for the modules and one for the components.
This fixes lazy loading modules.
See the design docs for details:
https://docs.google.com/document/d/1OEUIwc-s69l1o97K0wBd_-Lth5BBxir1KuCRWklTlI4
BREAKING CHANGES
`ComponentFactory.create()` takes an extra optional `NgModuleRef` parameter.
No change should be required in user code as the correct module will be used
when none is provided
DEPRECATIONS
The following methods were used internally and are no more required:
- `RouterOutlet.locationFactoryResolver`
- `RouterOutlet.locationInjector`
DEPRECATION:
Use `RouterModule.forRoot(routes, {initialNavigation: 'enabled'})` instead of
`RouterModule.forRoot(routes, {initialNavigtaion: true})`.
Before doing this, move the initialization logic affecting the router
from the bootstrapped component to the boostrapped module.
Similarly, use `RouterModule.forRoot(routes, {initialNavigation: 'disabled'})`
instead of `RouterModule.forRoot(routes, {initialNavigation: false})`.
Deprecated options: 'legacy_enabled', `true` (same as 'legacy_enabled'),
'legacy_disabled', `false` (same as 'legacy_disabled').
The "Router Initial Navigation" design document covers this change.
Read more here:
https://docs.google.com/document/d/1Hlw1fPaVs-PCj5KPeJRKhrQGAvFOxdvTlwAcnZosu5A/edit?usp=sharing
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.