Similarly to what has been done in #46846 for the extended diagnostics about missing control flow directive that was only mentioning that the `CommonModule` should be imported, this commit improves the validation done by the JiT compiler.
Now that the control flow directives are available as standalone, the message mentions that directive itself can be imported.
The message now also mentions which import should be used for the directive (as it can be tricky to figure out that `NgForOf` is the directive corresponding to `*ngFor`).
PR Close#46903
This commit refactors the `NgModuleRef` implementation to drop functions required by the `EnvironmentInjector` interface. Previously the idea was that the `NgModuleRef` can act as an Injector to facilitate easier transition to standalone. However, from the mental model perspective, the `NgModuleRef` has the `injector` field, which is the correct injector reference and can be used is needed as an `EnvironmentInjector`.
PR Close#46896
The `createApplication` function makes it possible to create an
application instance (represented by the `ApplicationRef`)
without bootstrapping any components. It is useful in the
situations where ones wants to decouple and delay components
rendering and / or render multiple root components in one
application. Angular elements can use this API to create
custom element types with an environment linked to a
created application.
PR Close#46475
This commit refactors the code to move some functions around to avoid circular dependencies in TS imports. The newly added functions are now located in the `packages/core/src/render3/component.ts` file (instead of `packages/core/src/render3/component_ref.ts`), which is a better place for them anyway.
PR Close#46685
This commit introduces a new function that allows creating a object which exposes a number of getters to retrieve information about a given component.
Closes#44926.
PR Close#46685
This commit introduces a new function that allows creating a `ComponentRef` instance based on provided Component and a set of options. The function can be used to cover a number of use-cases where the `ComponentFactory` symbol was used previously.
Closes#45263.
PR Close#46685
Currently if the `ENVIRONMENT_INITIALIZER` token is not configured with `multi: true` flag, the code fails while trying to iterate over the value. This commit checks whether the `ENVIRONMENT_INITIALIZER` token value type is an array and throws a helpful error message.
PR Close#46829
This commit adds the `createNgModuleRef` function alias to the public API. The alias is called `createNgModule`. The `createNgModule` name is more consistent with the rest of the API surface, where functions that return `*Ref`s don't include the `Ref` into the function name, for example: `createPlatform`, `ViewContainerRef.createComponent`, etc.
DEPRECATED:
The `createNgModuleRef` is deprecated in favor of newly added `createNgModule` one.
PR Close#46789
Import `AsyncStackTaggingZoneSpec` if the user imported
`zone.js/plugins/async-stack-tagging` bundle. So the user can
use `console.trace` to output the `async task` information more
clearly.
PR Close#46693
There are legitimate cases where access to an EnvironmentInjector
of a bootstrapped application is required / convenient. It will be also
required for support of standalone components with Angular elements.
PR Close#46665
`BootstrapOptions` is exposed through `PlatformRef#bootstrapModule` but
is not included in the public API so you cannot find it on angular.io.
This commit simply marks the interface as public API (as it should be).
PR Close#46679
This change adds the setInput method to the ComponentRef.
Previously users had to call `componentRef.instance['inputName']`
to change inputs of a dynamically created component. This had
several problems:
* OnPush components were not marked for check and thus very
difficult to test;
* input aliasing was not take into account - a property name
on a component could have been different from the actual input
name so setting input properties was fragile;
* manually setting input propertie would NOT trigger the
`NgOnChanges` lifecycle hook.
This modifications unifies `@Input` accross dynamically created
components and the ones referenced in templates. This also opens
doors to other changes: as an example router could use this new
method to set `@Input`s from router params.
Closes#12313Closes#22567
PR Close#46641
`inject()` originated as a private API and was made public to support
`InjectionToken` factories in Ivy. For code-size and performance reasons,
when we code generate `inject()` calls we use a bit field to indicate the
various injection modes (optional, skip-self, etc). However, this doesn't
make for a very nice public API.
This commit introduces an alternative object-based API for options. All 4
flags are supported as `boolean` fields on an options object, and converted
to bit flags internally. If TypeScript can prove that `optional` injection
is not requested, it can narrow the return type and remove the `null` type.
DEPRECATED:
The bit field signature of `inject()` has been deprecated, in favor of the
new options object. Correspondingly, `InjectFlags` is deprecated as well.
Fixes#46251
PR Close#46649
This commit introduces a new API on `EnvironmentInjector` to run a function
in the context of the injector. This makes `inject()` available within the
body of the function to inject dependencies. We expect this functionality to
be very useful for designing ergonomic APIs both in and out of Angular, as
it should allow for a smaller and more functional API style.
Note that it's possible to implement nearly identical functionality in user
code already today:
```typescript
function runInContext<T>(injector: EnvironmentInjector, fn: () => T): T {
const token = new InjectionToken<T>('TOKEN');
const tmpInjector = createEnvironmentInjector([
{provide: token, useFactory: () => fn()},
], injector);
return tmpInjector.get(token);
}
```
The factory provider for `token` in this example runs in the context of the
`tmpInjector`, giving it access to `inject` that can retrieve values from
`injector` as well. This is nearly identical, although because of the child
injector `self` and `skipSelf` injection options don't function correctly.
PR Close#46653
This commit removes the experimental `renderComponent` operation, which
implemented an alternative, lighter-weight bootstrapping option. This
experiment is being discontinued as the path towards it being a supported
production API was not clear. In particular, it lacked a clear roadmap for
supporting Angular's change detection, particularly when consuming existing
components.
PR Close#46605
This commit removes the `Renderer3` experiment which attempted to use the
real DOM API as Angular's renderer. As shown in the diff, having this
experiment around added real code complexity to Angular that could not be
removed by an optimizer.
Since we no longer feel this experiment is worth continuing, we're removing
the `Renderer3` concept and all supporting code.
PR Close#46605
Previously, when instantiating a component, Angular would look in the DI
hierarchy for `RendererFactory2`. Any DI tree which rolls up through an
application injector (that is, one created with `BrowserModule`) should be
able to provide this interface. If not found, Angular would switch to the
experimental `Renderer3` mechanism. This switch was designed this way,
because it allowed for the creation of experimental applications where
`RendererFactory2` was not included in the bundle at all.
In this commit, instead of automatically falling back on `Renderer3`-style
rendering, an error is raised instead if `RendererFactory2` is missing from
the DI hierarchy.
PR Close#46605
Due to the restrictions of circular dependency checking, we need a separate
internal interface for a renderer. We cannot use `Renderer2` as a type
internally as even importing it as a type incurs a dependency on its
implementation, which creates a major potential for circular dependencies.
Previously this role was served by the `Renderer3` type. As we prepare to
remove the `Renderer3` abstraction (the idea of using `document` as a
differently-shaped renderer), this commit renames `ProceduralRenderer3` to
the more generic term `Renderer`.
`RendererFactory3` is also renamed to the more generic `RendererFactory` for
consistency.
PR Close#46605
This commit updates the `ApplicationRef` logic to trigger the destroy operation when an underlying platform is destroyed. This is needed to make sure all teardown processing is completed correctly to avoid memory leaks.
Closes#46473.
PR Close#46497
The `Renderer3` abstraction in Angular was an experimental code path in Ivy
which uses direct DOM operations instead of the former `Renderer2` path. To
allow `Renderer2` to tree-shake away, `Renderer3` is the default _unless_
`Renderer2` is provided. It was only an experiment, and never meant to be a
production code path.
However, it's possible for `Renderer3` to leak into user code. This commit
prevents that possibility by causing the `Renderer3` path to throw, unless
an explicit function has been called to enable it.
PR Close#46530
Currently, when importing `BrowserAnimationsModule`, Angular provides
`AnimationRendererFactory` as the `RendererFactory2`. The `AnimationRendererFactory`
relies on the `AnimationEngine`. The `AnimationEngine` may be created earlier than the
`ApplicationRef` (e.g. if it's requested within the `APP_INITIALIZER` before the `ApplicationRef`
is created). This means that Angular will add the `AnimationEngine` to `R3Injector.onDestroy`
before the `ApplicationRef`. The `R3Injector` will call `ngOnDestroy()` on the `AnimationEngine`
before the `ApplicationRef`, which means the `flush()` will be called earlier before views are destroyed.
PR Close#45108
PR Close#45143
During JIT compilation of standalone components the compiler did not deduplicate
declarations in the imports array, unlike the AOT compiler. This may result in
runtime errors during directive matching, when the same component is found
multiple times resulting in NG0300, for example:
> NG0300: Multiple components match node with tagname mat-form-field: MatFormField and MatFormField.
This commit fixes the issue by deduplicating imports in the JIT compiler.
Relates to https://github.com/angular/angular/issues/46109#issuecomment-1160705031Closes#46109
PR Close#46439
tsec previously did not use runfiles on Windows even when the flag was enabled.
The latest version now adds an option to force its usage.
PR Close#46447
Previously, the `createEnvironmentInjector` function allowed creating an instance of an EnvironmentInjector without providing a parent injector. This resulted in an injector instance, which was detached from the DI tree, thus having limited value. This commit updates the types of the `createEnvironmentInjector` function to make the parent injector a required argument.
PR Close#46397
Align tree shakable error messages are simplified with the new format and errorMessage variables are removed.
```ts
throw new RuntimeError(
RuntimeErrorCode.INJECTOR_ALREADY_DESTROYED,
ngDevMode && 'Injector has already been destroyed.');
```
PR Close#46370
This commit exports the `isHostComponentStandalone` function and also changes a location where it's imported from. The function was moved recently in a different PR, which caused some conflicts after merging other PRs that relied on the old structure.
PR Close#46274
Add info to the pipe not found error message so to give some help to the developer for
resolving the problem more efficiently
(Note: this change also distinguishes the case in which the hosting component is standalone)
PR Close#46247
the formatted error messages always include a period separator between the
provided error message and the find-more suffix, this is not always
desirable as it may add periods when they shoud not be, so improve the
formatting by checking and applying the period only if the provided message
doesn't end with a character which already represents a separator
additionally also improve the formatting by trimming the provided error
message
note that such trimming needs to be performed before the separator check
so that for example an error message like `"some error! "` doesn't produce
`"some error! ."` but it successfully produces "some error!"
PR Close#46239
improve code regarding element validation by creating a new file
exporting validation functions and not exporting utils previously
globally available
PR Close#46175
Makes the following improvements in the runtime:
* Uses the unique ID of the component definition to keep track of its injector in the `StandaloneFeature`, instead of the definition itself. This reduces the amount of memory we can leak, if something doesn't get cleaned up.
* Changes the naming and description of the `ComponentDef.id` to reflect what it is used for.
PR Close#46093
There's some old logic in the error handler that tries to read an `ngErrorHandler` property off of the errors that are being logged. As far as I can tell, this is a ViewEngine leftover and it isn't actually being used anywhere.
PR Close#46216
In #45445 function inlining had to be disabled on one of our instructions, because Closure wasn't optimizing it correctly, causing an error at runtime. The error has been resolved so we can remove the deoptimization hint.
PR Close#46149
This commit adds the new `@developerPreview` tag to all of the standalone
component related APIs. With this, AIO will show an API status label which
links to the documentation on Developer Preview.
PR Close#46050
This commit updates the `bootstrapApplication` and the `importProvidersFrom` function docs with additional content that includes usage examples.
PR Close#46202
This commit adds the Standalone guide link to the `@Component`, `@Directive` and `@Pipe` decorator properties related to standalone functionality to improve discoverability of the guide as well as providing extra context in API docs.
PR Close#46184
This commit updates the `inject` function docs by:
- rephrasing a description to include more usage cases
- adding usage examples
- making a function itself a public API (vs its alias const that was used previously)
PR Close#46168