Skip to content

MediaMarshaller

Alessio Bianchini edited this page Dec 18, 2025 · 1 revision

MediaMarshaller

MediaMarshaller is the internal engine that coordinates directive registrations and triggers style updates when breakpoints activate/deactivate.

Most applications do not need to use it directly, but it can be useful for advanced integrations and custom directives.

RxJS API (base)

import { MediaMarshaller } from 'ng-flex-layout/core';

constructor(private marshal: MediaMarshaller) {
  // Track value changes for a specific element+key pair.
  marshal.trackValue(myElement, 'layout').subscribe(({ value }) => {
    // value is the current registered value for that key
  });
}

Signals wrapper (non-breaking)

trackValueAsSignal() is a convenience wrapper around toSignal(marshal.trackValue(...)).

import { Injector, effect, inject } from '@angular/core';
import { MediaMarshaller } from 'ng-flex-layout/core';

export class MyCmp {
  private readonly injector = inject(Injector);
  private readonly marshal = inject(MediaMarshaller);

  readonly layout = this.marshal.trackValueAsSignal(myElement, 'layout', { injector: this.injector });

  constructor() {
    effect(() => {
      const { value } = this.layout();
      // react to value
    });
  }
}

Clone this wiki locally