How Can Angular Signals be Integrated into ngxs Selector State Management?

Am using ngxs state management and have the following state and selectors:

export interface ITodoCountState {
count: string;
}

@State<ITodoCountState>({
name: 'todosCount',
defaults: {
count: '',
},
})
@Injectable()
export class TodoCountState {
@Selector([TodoCountState])
static count(state: ITodoCountState) {
return state.count;
}

@Action(SetTodosCount)
GetTodosCount(ctx: StateContext<ITodoCountState>, action: SetTodosCount) {
ctx.patchState({
count: action.count,
});
}
}


And then in my component have it like this:

@Select(TodoCountState.count) todosCount$!: Observable<string>;


todosCount$ is directly used in my html template.

How can I use Angular Signals for todosCount$?

Continue reading...