import { Component , OnDestroy } from '@angular/core' ; import { TrafficList , TrafficListData } from '../../../@core/data/traffic-list' ; import { TrafficBarData , TrafficBar } from '../../../@core/data/traffic-bar' ; import { takeWhile } from 'rxjs/operators' ; @ Component ( { selector : 'ngx-traffic-reveal-card' , styleUrls : [ './traffic-reveal-card.component.scss' ] , templateUrl : './traffic-reveal-card.component.html' , } ) export class TrafficRevealCardComponent implements OnDestroy { private alive = true ; trafficBarData : TrafficBar ; trafficListData : TrafficList ; revealed = false ; period : string = 'week' ; constructor ( private trafficListService , private trafficBarService ) { this . getTrafficFrontCardData ( this . period ) ; this . getTrafficBackCardData ( this . period ) ; } toggleView ( ) { this . revealed = ! this . revealed ; } setPeriodAngGetData ( value ) { this . period = value ; this . getTrafficFrontCardData ( value ) ; this . getTrafficBackCardData ( value ) ; } getTrafficBackCardData ( period ) { this . trafficBarService . getTrafficBarData ( period ) . pipe ( takeWhile ( ( ) => this . alive ) ) . subscribe ( trafficBarData => { this . trafficBarData = trafficBarData ; } ) ; } getTrafficFrontCardData ( period ) { this . trafficListService . getTrafficListData ( period ) . pipe ( takeWhile ( ( ) => this . alive ) ) . subscribe ( trafficListData => { this . trafficListData = trafficListData ; } ) ; } ngOnDestroy ( ) { this . alive = false ; } }