How to make transition when expression change

@amjado3 wrote:

Are there any way to make transition when expression was change

This my html code. I want to make transition of the <div class="fadeIn">{{ phrase }}</div> when expression change ( {{ phrase }} )

<div class="fadeIn">{{ phrase }}</div> /*I use animate.css framework*/
<button ion-button (click)="previous()">Previous</button>
<button ion-button (click)="next()">Next</button>

TypeScript file

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

export class RecipePage implements OnInit{

  phrase: string;
  ngOnInit() { this.phrase = "Hi"; }
  next() { this.phrase = "Next phrase"; }
  previous() { this.phrase = "Previous phrase"; }
}

when I click button the text was change but the animation not working because I use typescript to change the text this.phrase = "here";

Are there way to make transition when expression was change by typescript

Posts: 1

Participants: 1

Read full topic