mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
feat(router): add unmatchedInputBehavior option to componentInputBinding
Introduce a new configuration option `unmatchedInputBehavior` to the `componentInputBinding` feature. This option allows users to configure the behavior when a component input is not matched by any key in the router data. The available values are: - 'alwaysUndefined': (Default) Always binds undefined to unmatched inputs. - 'undefinedIfStale': Binds undefined only if the input was previously available in the router data for the active route in the outlet. This feature addresses concerns raised in #63835 and #52946 regarding the retention of default values for inputs that were never targeted by the router, while still ensuring that stale data is cleared when a parameter is removed.
This commit is contained in:
committed by
Alex Rickabaugh
parent
aab7dd48c0
commit
c84642ac16
@@ -66,6 +66,28 @@ Use `ComponentInputBindingOptions` to disable query parameter binding if you man
|
||||
provideRouter(appRoutes, withComponentInputBinding({queryParams: false}));
|
||||
```
|
||||
|
||||
### Configure behavior for inputs not available in router data
|
||||
|
||||
By default, the router sets an input to `undefined` if it was not available in the router data during a navigation. This ensures that stale data is not retained.
|
||||
|
||||
If you want to avoid setting `undefined` for inputs that have _never_ been available in the router data for the active component instance, you can set the `unmatchedInputBehavior` option to `'undefinedIfStale'`:
|
||||
|
||||
```ts
|
||||
provideRouter(appRoutes, withComponentInputBinding({unmatchedInputBehavior: 'undefinedIfStale'}));
|
||||
```
|
||||
|
||||
When you combine `unmatchedInputBehavior: 'undefinedIfStale'` with `queryParams: false`, inputs retain their initial values unless they are explicitly provided by the router. The exception is matrix parameters: if a matrix parameter is provided in one navigation and removed in a subsequent one, the router will set the input to `undefined` to avoid retaining stale data.
|
||||
|
||||
```ts
|
||||
provideRouter(
|
||||
appRoutes,
|
||||
withComponentInputBinding({
|
||||
queryParams: false,
|
||||
unmatchedInputBehavior: 'undefinedIfStale',
|
||||
}),
|
||||
);
|
||||
```
|
||||
|
||||
### Inherit parent route data
|
||||
|
||||
By default, child routes inherit parameters and data from parent routes (equivalent to `paramsInheritanceStrategy: 'always'`). This means you can access parent route info directly in child components.
|
||||
|
||||
Reference in New Issue
Block a user