Common Utilities

The @ngrx-addons/common package provides shared utilities used by both persist-state and sync-state. You can also use them independently.

Key Filtering Operators

excludeKeys

An RxJS operator that removes specified keys from the emitted state object:

import { excludeKeys } from '@ngrx-addons/common';

state$.pipe(excludeKeys(['temporaryFlag', 'loading']));
// { count: 1, temporaryFlag: true, loading: false }
// → { count: 1 }

includeKeys

An RxJS operator that keeps only the specified keys:

import { includeKeys } from '@ngrx-addons/common';

state$.pipe(includeKeys(['count', 'name']));
// { count: 1, name: 'test', loading: false }
// → { count: 1, name: 'test' }

isEqual

A deep equality comparison function used internally by distinctUntilChanged to prevent unnecessary storage writes / broadcasts:

import { isEqual } from '@ngrx-addons/common';

isEqual({ a: 1, b: { c: 2 } }, { a: 1, b: { c: 2 } }); // true
isEqual({ a: 1 }, { b: 1 }); // false
isEqual([1, 2, 3], [1, 2, 3]); // true
isEqual(new Date(1), new Date(1)); // true, dates are compared by time
isEqual(new Map([['a', 1]]), new Map([['a', 1]])); // true, maps by entries
isEqual(new Set([1, 2]), new Set([2, 1])); // true, sets by values
isEqual([1, 2], { 0: 1, 1: 2 }); // false, different prototypes

Values with different prototypes, such as an array and an object, are never equal. Set values are matched with Set.has, so objects inside sets must be the same instances.

Initialization Strategies

BeforeAppInit

Resolves immediately. State is rehydrated / synced before APP_INITIALIZER completes.

This is the default strategy for both persist-state and sync-state.

AfterAppInit

Resolves only after markAsInitialized() is called. Useful when your app initializers need the default state before rehydration:

import { AfterAppInit } from '@ngrx-addons/common';

// In your provider config
providePersistStore({
  strategy: AfterAppInit,
  states: [...],
});

// In your root component
@Component({ ... })
export class AppComponent {
  private readonly afterAppInit = inject(AfterAppInit);

  ngOnInit() {
    // Trigger rehydration after your initialization logic
    this.afterAppInit.markAsInitialized();
  }
}

The afterAppInitProvider is automatically included when you use providePersistStore or provideSyncStore.