¿Por qué Angular está llamando a un objeto obviamente definido como indefinido?

En mi reducer ngrx, declaro el siguiente initialState:

const initialState = {
homeState: {
banner: {
images: [‘142_111421_HOMEPAGE_HERO-SLIDE_1_DESKTOP_EN.jpg’, ‘5434424542.jpg’],
}
}
}

En mi componente, obtengo el initialState del reducer de la siguiente manera:

private getHomeState = () => {
const homeState$ = this.store.select(state => {
return state.homeState;
})

homeState$.subscribe((homeState) => {
console.log(‘homeState’, homeState)
console.log(‘homeState.banner’, homeState.banner)
this.homeState = homeState;
})
}

Hay dos console logs en la declaración subscribe anterior. El primero, console.log(‘homeState’, homeState), registra correctamente homeState como se espera con el banner como atributo de homeState como se muestra a continuación:

homeState: {
banner: {
images: [‘142_111421_HOMEPAGE_HERO-SLIDE_1_DESKTOP_EN.jpg’, ‘5434424542.jpg’],
}
}

Pero console.log(‘homeState.banner’, homeState.banner) dice que banner es indefinido aunque está presente y se registra correctamente como se muestra arriba.

homeState.banner indefinido