@angular/router

withComponentInputBinding

function

Enables binding information from the Router state directly to the inputs of the component in Route configurations.

  
    function withComponentInputBinding(): ComponentInputBindingFeature;

Basic example of how you can enable the feature:

          const appRoutes: Routes = [];bootstrapApplication(AppComponent,  {    providers: [      provideRouter(appRoutes, withComponentInputBinding())    ]  });

The router bindings information from any of the following sources:

query parameters
path and matrix parameters
static route data
data from resolvers

Duplicate keys are resolved in the same order from above, from least to greatest, meaning that resolvers have the highest precedence and override any of the other information from the route.

Importantly, when an input does not have an item in the route data with a matching key, this input is set to undefined. This prevents previous information from being retained if the data got removed from the route (i.e. if a query parameter is removed). Default values can be provided with a resolver on the route to ensure the value is always present or an input and use an input transform in the component.

withComponentInputBinding

ComponentInputBindingFeature

Enables binding information from the Router state directly to the inputs of the component in Route configurations.

@returnsComponentInputBindingFeature