NgRx computed not Update Value when used in NgRx Store

I have a computed in my signal store, which should react on a value change but it just fires 1 time at creating and not when signal values are changing

const initialData = {
gridItems: [] as StrukturenDraggedDataItem[],
treeItem: null as StrukturbaumTreeNodeData<StrKnotenTargetNode & StrMedienelementeTargetNode & StrTextelementeTargetNode> | null,
target: null as SelectionTreeTypes | null,
};

export const NgStrStore = signalStore(
withState(initialData),
withComputed((store) => {
const ngStrService = inject(NgStrService);
const canReferenzieren = computed(() => {
console.log('compute canReferenzieren');
const treeItems = store.treeItem();
if (store.gridItems() && treeItems) {
return ngStrService.service.canReferenzieren(treeItems, store.gridItems(), false);
}
else {
return undefined;
}
});
return {canReferenzieren};
}),
createUpdateGridItemsFeature(),
createUpdateTreeItemsFeature(),
);


export function createUpdateGridItemsFeature() {
return signalStoreFeature(
withState(initialData),
withMethods((store) => {
const ngStrService = inject(NgStrService);
const updateGridItems = (gridItems?: any[]) => {
const treeItem = store.treeItem();
const storedGridItems = store.gridItems();
const target = store.target();
// grid feuert ende von Drag&Drop und setzt gridItems auf undefined, hiervor muss dropOnTree() aufgerufen werden
if (storedGridItems && treeItem && !isDefined(gridItems) && target) {
ngStrService.onDrop(storedGridItems, treeItem, target);
}
patchState(
store,
{
gridItems,
},
);
};
return {updateGridItems};
}),
);
}

export function createUpdateTreeItemsFeature() {
return signalStoreFeature(
withState(initialData),
withMethods((store) => {
const updateTreeItems = (
treeItem?: StrukturbaumTreeNodeData<StrKnotenTargetNode & StrMedienelementeTargetNode & StrTextelementeTargetNode>,
event?: MouseEvent,
) => {
patchState(
store,
{
treeItem,
target: (event?.target as HTMLElement)
?.closest('[strSelectionTreeIdentificationName]')
?.getAttribute('strSelectionTreeIdentificationName') as SelectionTreeTypes | null,
},
);
};
return {updateTreeItems};
}),
);
}


canReferenzieren should change when i updateTreeItems or updateGridItems (both Functions of the store which are updating values). But when there is a value change, nothing is happening.

if i react on store.treeItem() or store.gridItems() in an effect, it is working.

The computed is used as value in an HTML Template

Continue reading...