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

import { trigger, state, style, animate, transition} from '@angular/animations';

@Component({ selector: 'app-health-block2', templateUrl: './health-block2.component.html', styleUrls: ['./health-block2.component.scss'], animations: [ trigger('triggerBackgroundChange', [ state ('red', style({'background-color':'red', 'color' : 'black'})), state ('blue', style({'background-color':'blue', 'color' : 'white'})), state ('blue', style({'background-color':'blue', 'color' : 'white'})), transition ('* => *', animate(3000)) ]) ] }) export class HealthBlock2Component implements OnInit { title = 'Basic Animation in Angular 4'; color: string='red'; changeColor(){ if (this.color == 'red') this.color = 'blue'; else this.color = 'red'; }

constructor() { }

ngOnInit() { }

}


86 0 0