This commit updates the `NgOptimizedImage` directive to drop the `loader` input. Component-specific loaders can still be configured via `IMAGE_LOADER` token and the `loader` input was only useful in case different loaders have to be present in a single template, which doesn't seem to be a common case. We'll be able to re-introduce the input later if needed.
PR Close#47082
We want it to be clear what benefits the image directive
confers over a normal <img> tag, and the `NgImage` name
didn't provide much information. `NgOptimizedImage` makes
it obvious that the new directive is intended to improve
performance.
PR Close#47082
This commit exports experimental `NgImage` directive via a private API of the `@angular/common` package, so that it can be used acorss other Angular packages for testing purposes.
PR Close#47082
Adds support for TypeScript 4.8 and resolves some issues that came up as a result of the update.
Most of the issues came from some changes in TypeScript where the `decorators` and `modifiers` properties were removed from most node types, and were combined into a single `modifiers` array. Since we need to continue supporting TS 4.6 and 4.7 until v15, I ended up creating a new `ngtsc/ts_compatibility` directory to make it easier to reuse the new backwards-compatible code.
PR Close#47038
This commit creates and exposes the APIs required to use the Angular Router without importing `RouterModule`.
The newly added APIs are tree-shakable and you can add features using special functions rather than using `ExtraOptions` to control the providers via an internal switch in Router code.
```
const appRoutes: Routes = [];
bootstrapApplication(AppComponent,
{
providers: [
provideRouter(appRoutes,
withDebugTracing(), // enables debug tracing feature
withInMemoryScrolling() // enables scrolling feature
]
}
);
```
This "features" pattern allows for router behavior to evolve in a backwards compatible and tree-shakable way in the future. This approach also makes features more discoverable.
The newly added APIs can be used in any application today (doesn't require an application to be bootstrapped using standalone-based APIs).
Note: APIs added in this commit are released in the "Developer Preview" mode, read more about this mode in Angular docs: https://angular.io/guide/releases#developer-preview
PR Close#47010
Add wider typings to setter of preserveFragment, skipLocationChange and replaceUrl inputs of routerLink directives and coerce them to boolean
PR Close#47101
createEmbeddedView method instantiates an embedded view based on this template and take your templateRef as argument and would render the passed templateRef in your ViewContainerRef.
resolves angular#46955
PR Close#46957
Addresses https://github.com/angular/angular/issues/47059
I try to keep the edit as concise as possible because adding any further
explanation would bring to much deeper info compared to the topic of the
page
Removed some convoluted info and replaced with a link to a page that
should focus on the specific aspect of the matter.
Conditional is obliged because IMHO that page should have a dedicated
paragraph explaining various ways of populating different injectors with
providers, and maybe integrating the interesting parts from the recent
created page about standalone app.
PR Close#47094
Some versions of rxjs cause the algorithm used in the Router to not recognize Route configs correctly.
This commit updates the algorithm to be compatible in the same way as other code locations internally.
Context:
https://github.com/angular/angular/commit/1160b8194f78141b40d1d4885ec182d033ff2659fixes#47089
Note: This does not have a test because I was unable to identify the
version of rxjs that would cause a failure here.
PR Close#47098
This brings the typing of ngStyle into parity with ngClass since commit
e2ab99b95e. Should help with some strict template checking edge cases.
PR Close#47069
Adds suggestions for how to resolve the most common messages produced by the documentation linter.
Adds links to the Proselint and other style tests to the new documentation.
Updates pullapprove and navigation.
PR Close#47019
Users using the "disabled" property binding on reactive form controls would want to know how to dynamically update the disabled state of a form control when they get a console warning.
PR Close#47041
We used to track all modules in a top-level constant called `autoRegisterModuleById` which was used by `getRegisteredNgModuleType`. As of #45024 the constant isn't being used anymore so we can remove it.
PR Close#47066
Yarn 1.x. is known to not prune nested unused node modules. This throws
off Bazel when the dependency tree changes but there are leftover unused
nested node module folders. This causes CI failures currently after the
dependency tree updates.
Invalidating the cache fixes this issue. Long-term a switch to Yarn
2.x+, pnpm will fix this.
PR Close#46707
The current Router APIs require guards/resolvers to be present in the DI tree. This is because we want to treat all guards/resolvers equally and some may require dependencies. This requirement results in quite a lot of boilerplate for guards. Here are two examples:
```
const MY_GUARD = new InjectionToken<any>('my_guard');
…
providers: {provide: MY_GUARD, useValue: () => window.someGlobalState}
…
const route = {path: 'somePath', canActivate: [MY_GUARD]}
```
```
@Injectable({providedIn: 'root'})
export class MyGuardWithDependency {
constructor(private myDep: MyDependency) {}
canActivate() {
return myDep.canActivate();
}
}
…
const route = {path: 'somePath', canActivate: [MyGuardWithDependency]}
```
Notice that even when we want to write a simple guard that has no dependencies as in the first example, we still have to write either an InjectionToken or an Injectable class.
With this commit router guards and resolvers can be plain old functions.
For example:
```
const route = {path: 'somePath', component: EditCmp, canDeactivate: [(component: EditCmp) => !component.hasUnsavedChanges]}
```
Additionally, these functions can still use Angular DI with `inject` from `@angular/core`.
```
const route = {path: 'somePath', canActivate: [() => inject(MyDependency).canActivate()]}
```
PR Close#46684
Refactored the DI section to improve doc quality, reduce cognitive load and drive consistency.
- Added an overview with prerequisites and doc cards that point to rest of the DI content
- Added introduction topic with topic purpose, value proposition and "fail fast"
- Broke apart complex concepts into simpler tasks
- Unified tone and language for each topic
- Added new content based on SME feedback
- Deleted obsolete content
PR Close#44466
The `RootContext` implementation contained a number of fields that were needed to support an experimental `renderComponent` function. The `renderComponent` function was removed, which allows us to cleanup the `RootContext` further.
The only field that remains on the `RootContext` is the list of bootstrapped components. This list is presumably mostly unused right now (it just contains the current component) and further refactoring can happen in a followup PR.
PR Close#46806
Andrew Kushnir