Currently, I am attempting to define my AppState for the first time.
In my app state, there is only one store.select('sunDial'), which is an Object that I am struggling to properly type when selecting a slice from AppState.
Question: How do I accurately add types to this basic example of a component and AppState?
This is the component I have:
import { Component, ChangeDetectionStrategy, OnInit } from '@angular/core';
import { Store } from '@ngrx/store';
import { AppState, SunDial } from '../app.interface';
import { Observable } from 'rxjs';
@Component({
selector: 'sun-dial',
templateUrl: 'sun-dial.component.html',
styleUrls: ['sun-dial.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class SunDialComponent implements OnInit {
private partOfDay: Observable<SunDial>; // Is this an Observable??
public activeInputField: SunDial; // Is this referencing as a number?
constructor(private store: Store<AppState>) { // This line appears frequently
this.partOfDay = store.select<SunDial>('sunDial'); // Does it select sunDial:SunDial?
}
ngOnInit() {
this.partOfDay.subscribe(x => {
this.activeInputField = x;
});
}
}
Here is my AppState.ts file:
export interface AppState {
sunDial: SunDial; // does store.select('sunDial') create an object/observable?
}
export interface SunDial { // Is this truly an Observable?
activeInputField: number
}
No errors are being flagged in my WebStorm IDE, but I am unsure how to approach typing (essentially just making educated guesses). Can someone help me understand how to thoroughly annotate the types for my class SunDialComponent{}?
Reference: what is store.select in ngrx