injectParams

The injectParams function is a versatile utility for injecting and transforming route parameters within an Angular application. It provides a reactive way to access and manipulate route parameters using Angular's signals-based architecture, making it easier to handle dynamic routing scenarios.

Examples

Example 1: Get All Route Parameters

When called without any arguments, returns a signal containing the entire params object:

import {injectParams} from 'ngx-lift';

export class MyComponent {
  // Returns a signal with the current route params
  params = injectParams();
}

Example 2: Get Single Parameter

When a key is specified, returns the value of the corresponding parameter as a signal:

import {injectParams} from 'ngx-lift';
import {Signal} from '@angular/core';

export class MyComponent {
  // Returns a signal with the value of the id param
  userId: Signal<string | null> = injectParams('id');
}

Example 3: Transform Parameters

Transform parameters using a transform function:

import {injectParams} from 'ngx-lift';

export class MyComponent {
  // Returns a signal with the keys of the params
  paramsKeys = injectParams((params) => Object.keys(params));

  // Pass a transform function directly
  name = injectParams((params) => params['name'] as string);
}

Example 4: Transform with Initial Value

Transform parameters with an initial value and type conversion:

import {injectParams} from 'ngx-lift';
import {numberAttribute, Signal} from '@angular/core';

export class MyComponent {
  // Returns a signal with the value of the id param, initialValue is 1
  id: Signal<number> = injectParams('id', {
    transform: numberAttribute,
    initialValue: 1,
  });
}

When initialValue is provided as a boolean or number, transform function must be provided returning the same type.

Example 5: Complete Usage Example

Complete example showing various usage patterns:

import {injectParams, computedAsync} from 'ngx-lift';
import {numberAttribute, Signal} from '@angular/core';

export class UserDetailComponent {
  // Get all params
  params = injectParams();

  // Get single param
  userId: Signal<string | null> = injectParams('id');

  // Transform with initial value
  id: Signal<number> = injectParams('id', {
    transform: numberAttribute,
    initialValue: 1,
  });

  // Transform function
  paramsKeys = injectParams((params) => Object.keys(params));

  // Use with computedAsync to fetch data when param changes
  user = computedAsync(() => this.userService.getUser(this.userId()));
}

API Reference

injectParams

Injects and transforms route parameters as reactive signals.

Signature

injectParams(): Signal<Params>
injectParams(key: string): Signal<string | null>
injectParams<T>(key: string, options: InjectParamsOptions<T>): Signal<T>
injectParams<T>(transform: (params: Params) => T): Signal<T>
injectParams<T>(transform: (params: Params) => T, options: InjectParamsOptions<T>): Signal<T>

Parameters

keyOrTransform?: string | ((params: Params) => T)
(Optional) When a string is provided, returns the value of that route parameter. When a function is provided, it's used as a transform function to process all route parameters.
If omitted, returns a signal containing the entire params object of the current route.
options?: InjectParamsOptions<T>
(Optional) Configuration object containing transform function and/or initialValue.
If initialValue is a boolean or number, transform function must be provided to convert the string parameter to the correct type.

Returns

A signal containing the route parameter value(s) or transformed result.

Usage Patterns

No arguments: Returns signal with all route parameters
String key: Returns signal with specific parameter value (or null if not present)
Transform function: Returns signal with transformed parameters
With options: Allows initial value and type conversion