Skip to main content

Function: withEntityResources()

Call Signature​

withEntityResources<Input, Entity>(resourceFactory): SignalStoreFeature<Input, EntityResourceResult<Entity>>

Defined in: lib/with-entity-resources.ts:90

Experimental

Type Parameters​

Input​

Input extends SignalStoreFeatureResult

Entity​

Entity extends object

Parameters​

resourceFactory​

(store) => ResourceRef<TypedEntityResourceValue<Entity>>

Returns​

SignalStoreFeature<Input, EntityResourceResult<Entity>>

Description​

Integrates array-based Resource data into Entity-style state for NgRx SignalStore. This feature builds on withResource to provide an entity view over array resources.

  • For a single (unnamed) resource: exposes value, status, error, isLoading from the underlying resource (via withResource), and derives ids, entityMap, and entities via withLinkedState/withComputed.
  • For multiple (named) resources: registers each resource by name and exposes the same members prefixed with the resource name, e.g. todosIds, todosEntityMap, todosEntities, along with todosValue, todosStatus, etc.

No effects are used. All derived signals are linked to the resource's value through withLinkedState, so entity updaters such as addEntity, updateEntity, and removeEntity mutate the store's entity view without directly writing to the resource. The source of truth remains the resource value.

Usage Notes​

Unnamed resource example:

type Todo = { id: number; title: string; completed: boolean };

const Store = signalStore(
  { providedIn: 'root' },
  withEntityResources(() =>
    resource({ loader: () => Promise.resolve([] as Todo[]), defaultValue: [] }),
  ),
);

const store = TestBed.inject(Store);
store.status();    // 'idle' | 'loading' | 'resolved' | 'error' | 'local'
store.value();     // Todo[]
store.ids();       // EntityId[]
store.entityMap(); // Record<EntityId, Todo>
store.entities();  // Todo[]

// Works with @ngrx/signals/entities updaters
patchState(store, addEntity({ id: 1, title: 'X', completed: false }));

Named resources example:

const Store = signalStore(
  { providedIn: 'root' },
  withEntityResources(() => ({
    todos: resource({ loader: () => Promise.resolve([] as Todo[]), defaultValue: [] }),
    projects: resource({ loader: () => Promise.resolve([] as { id: number; name: string }[]), defaultValue: [] }),
  })),
);

const store = TestBed.inject(Store);
store.todosValue();
store.todosIds();
store.todosEntityMap();
store.todosEntities();
patchState(store, addEntity({ id: 2, title: 'Y', completed: true }, { collection: 'todos' }));

See​

withResource

Call Signature​

withEntityResources<Input, Dictionary>(resourceFactory): SignalStoreFeature<Input, NamedEntityResourceResult<Dictionary>>

Defined in: lib/with-entity-resources.ts:99

Experimental

Type Parameters​

Input​

Input extends SignalStoreFeatureResult

Dictionary​

Dictionary extends EntityDictionary

Parameters​

resourceFactory​

(store) => Dictionary

Returns​

SignalStoreFeature<Input, NamedEntityResourceResult<Dictionary>>

Description​

Integrates array-based Resource data into Entity-style state for NgRx SignalStore. This feature builds on withResource to provide an entity view over array resources.

  • For a single (unnamed) resource: exposes value, status, error, isLoading from the underlying resource (via withResource), and derives ids, entityMap, and entities via withLinkedState/withComputed.
  • For multiple (named) resources: registers each resource by name and exposes the same members prefixed with the resource name, e.g. todosIds, todosEntityMap, todosEntities, along with todosValue, todosStatus, etc.

No effects are used. All derived signals are linked to the resource's value through withLinkedState, so entity updaters such as addEntity, updateEntity, and removeEntity mutate the store's entity view without directly writing to the resource. The source of truth remains the resource value.

Usage Notes​

Unnamed resource example:

type Todo = { id: number; title: string; completed: boolean };

const Store = signalStore(
  { providedIn: 'root' },
  withEntityResources(() =>
    resource({ loader: () => Promise.resolve([] as Todo[]), defaultValue: [] }),
  ),
);

const store = TestBed.inject(Store);
store.status();    // 'idle' | 'loading' | 'resolved' | 'error' | 'local'
store.value();     // Todo[]
store.ids();       // EntityId[]
store.entityMap(); // Record<EntityId, Todo>
store.entities();  // Todo[]

// Works with @ngrx/signals/entities updaters
patchState(store, addEntity({ id: 1, title: 'X', completed: false }));

Named resources example:

const Store = signalStore(
  { providedIn: 'root' },
  withEntityResources(() => ({
    todos: resource({ loader: () => Promise.resolve([] as Todo[]), defaultValue: [] }),
    projects: resource({ loader: () => Promise.resolve([] as { id: number; name: string }[]), defaultValue: [] }),
  })),
);

const store = TestBed.inject(Store);
store.todosValue();
store.todosIds();
store.todosEntityMap();
store.todosEntities();
patchState(store, addEntity({ id: 2, title: 'Y', completed: true }, { collection: 'todos' }));

See​

withResource