search.component.ts

import { Component, } from '@angular/core';

import { Observable } from 'rxjs';
import { Store } from '@ngrx/store';

import * as searchReducer from '../store/search.reducer';
import * as searchSelector from '../store/search.selector';

@Component({
    selector: 'app-search',
    templateUrl: 'search.component.html',
    styleUrls: [ 'search.component.css' ]
})
export class SearchComponent {
    public currentStep: Observable<string>;
    public datasetName: Observable<string>;
    public criteriaStepChecked: Observable<boolean>;
    public outputStepChecked: Observable<boolean>;
    public resultStepChecked: Observable<boolean>;
    public queryParams: Observable<any>;
    
    constructor(private store: Store<searchReducer.State>) {
        this.currentStep = store.select(searchSelector.getCurrentStep);
        this.datasetName = store.select(searchSelector.getDatasetName);
        this.criteriaStepChecked = store.select(searchSelector.getCriteriaStepChecked);
        this.outputStepChecked = store.select(searchSelector.getOutputStepChecked);
        this.resultStepChecked = store.select(searchSelector.getResultStepChecked);
        this.queryParams = this.store.select(searchSelector.getQueryParams);
    }
}