BREAKING CHANGE:
- all `…Metadata` classes have been removed. Use the corresponding decorator
as constructor or for `instanceof` checks instead.
- Example:
* Before: `new ComponentMetadata(…)`
* After: `new Component(…)`
- Note: `new Component(…)` worked before as well.
Every decorator now is made of the following:
- a function that can be used
as a decorator or as a constructor. This function
also can be used for `instanceof` checks.
- a type for this function (callable and newable)
- a type that describes the shape of the data
that the user needs to pass to the decorator
as well as the instance of the metadata
The docs for decorators live at the followig places
so that IDEs can discover them correctly:
- General description of the decorator is placed on the
`...Decorator` interface on the callable function
definition
- Property descriptions are placed on the interface
that describes the metadata produces by the decorator
When lazily loading code, users need to be able to get hold of the
NgModuleFactory. For SystemJS environments, the SystemJS registry serves
this purpose. However other environments, such as modules compiled with
Closure compiler, do not expose exports object or a path based registry.
For these environments, `@NgModule` objects can include an identifier, and
the loading code can then pass `loadModule(id).then(() =>
getNgModule(id))` to the router.
closes#11145
Also rename `CompileIdentifierMetadata.runtime` into `CompileIdentifierMetadata.reference`.
Also remove `CompileIdentifierMetadata.equalsTo` as
now it is enough to just check the `reference` fields for equality.
fixes#5390
Before the change:
// original CSS
:host .foo .bar {...}
.foo .bar {...}
// translated to
[_nghost-shh-2] .foo .bar {...}
.foo[_ngcontent-shh-2] .bar[_ngcontent-shh-2] {...}
Note that `.foo` and `.bar` where not scoped and would then apply to nested components.
With this change those selectors are scoped (as they are without `:host`).
You can explicitly apply the style to inner component by using `>>>` or `/deep/`: `:host >>> .foo`
BREAKING CHANGE:
Exceptions are no longer part of the public API. We don't expect that anyone should be referring to the Exception types.
ExceptionHandler.call(exception: any, stackTrace?: any, reason?: string): void;
change to:
ErrorHandler.handleError(error: any): void;
BREAKING CHANGES:
- `#` and `var` are not supported any more in expressions, use `let`,
- `var-<name>` could not be used any more on templates, use `let-<name>`,
- `var-<name>` could not be used any more to create a reference, use `ref-<name>`.
BREAKING CHANGE: previously deprecated @Component.directives and @Component.pipes support was removed.
All the components and pipes now must be declarated via an NgModule. NgModule is the basic
compilation block passed into the Angular compiler via Compiler#compileModuleSync or #compileModuleAsync.
Because of this change, the Compiler#compileComponentAsync and #compileComponentSync were removed as well -
any code doing compilation should compile module instead using the apis mentioned above.
Lastly, since modules are the basic compilation unit, the ngUpgrade module was modified to always require
an NgModule to be passed into the UpgradeAdapter's constructor - previously this was optional.
Often it is useful to test a component without rendering certain directives/components
in its template because these directives require some complicated setup.
You can do that by using NO_ERRORS_SCHEMA.
TestBed.configureTestingModule({
schemas: [NO_ERRORS_SCHEMA]
});
This would disable all schema checks in your tests.
BREAKING CHANGE: Animations defined using an at-symbol prefix that are
not property bound are now invalid.
```html
<!-- this is now invalid -->
<div @flip="flipState"></div>
<!-- change that to -->
<div [@flip]="flipState"></div>
```
BREAKING CHANGE: Animations that are not bound using the at-symbol
prefix using `animate-` must now be preixed using `bind-animate-`.
```html
<!-- this is now invalid -->
<div animate-flip="flipState"></div>
<!-- is valid now -->
<div bind-animate-flip="flipState"></div>
```
Closes#10825
