A ProfileComponent injects the Redux store and calls this.readState() only inside the store.subscribe() callback. On initial render, the template shows no user data even though the store already has a user in state. What is the cause?

typescript export class ProfileComponent implements OnInit, OnDestroy { username: string; private unsubscribe: () => void;

constructor(@Inject(AppStore) private store: Store<AppState>) {}

ngOnInit(): void { this.unsubscribe = this.store.subscribe(() => this.readState()); // readState() never called manually }

readState(): void { this.username = this.store.getState().user.currentUser?.name; }

ngOnDestroy(): void { this.unsubscribe(); } }