Saltar al contenido principal
NeuralUIv1.14.3Nuevo
GitHub
Componente

Estado URL

NeuUrlStateService sincroniza el estado de la UI con los query params. Los parámetros son signals reactivas, funcionan con el botón Atrás del navegador y se pueden compartir como enlaces.

TypeScript
import { NeuUrlStateService } from '@neural-ui/core/url-state';

getParam + setParam

getParam('q')() → null
getParam('page')() → null
getParam('sort')() → null

patchParams (actualiza varios params en una sola navegación)

clearParams (elimina todos los query params)

Parámetros actuales

Sin params — URL limpia ✓
TypeScript
import { NeuUrlStateService } from '@neural-ui/core/url-state';

@Component({ ... })
export class MyComponent {
  private readonly urlState = inject(NeuUrlStateService);

  // Lectura reactiva (Signal) — se actualiza en cada NavigationEnd
  readonly q    = this.urlState.getParam('q');
  readonly page = this.urlState.getParam('page');
  readonly sort = this.urlState.getParam('sort');

  setSearch(value: string): void {
    // Escribe '?q=...' en la URL sin crear entrada en el historial
    this.urlState.setParam('q', value || null);
  }

  applyFilters(): void {
    // Actualiza varios params en una sola navegación
    this.urlState.patchParams({ q: 'angular', page: '1', sort: 'name' });
  }

  clearAll(): void {
    // Elimina todos los query params de la URL
    this.urlState.clearParams();
  }
}