import { AfterViewInit , ChangeDetectionStrategy , ChangeDetectorRef , Component , ViewEncapsulation } from '@angular/core' ; @ Component ( { selector : 'app-card-page' , templateUrl : './card-page.component.html' , styleUrls : [ './card-page.component.scss' ] , changeDetection : ChangeDetectionStrategy . OnPush , encapsulation : ViewEncapsulation . None } ) export class CardPageComponent implements AfterViewInit { cardWidth : number ; isSelected = true ; constructor ( private readonly cdr ) { } ngAfterViewInit ( ) { this . cdr . detectChanges ( ) ; } onDelete ( ) { console . log ( 'Card Deleted' ) ; } onResize ( card ) { this . cardWidth = card . width ; this . cdr . detectChanges ( ) ; } onClick ( ) { console . log ( 'Card clicked' ) ; } onSelect ( isSelected ) { console . log ( 'Card select' , isSelected ) ; } onActionClick ( ) { console . log ( 'Card action clicked' ) ; } }