CODEWITHSUNDEEP
animationtypescriptweb-deploymentangular
Adam Novakovi
Adam Novakovi

Reputation: 819

angular 4 animations - transition duration is not applied

what am I doing wrong? The transition happens but it's instant. The time set in animate function is not being applied

trigger('showMenu', [
  state('active', style({
    marginLeft: '0px'
  })),
  state('inactive', style({
    marginLeft: '-230px'
  })),
  transition('inactive => active', animate('2s')),
  transition('active => inactive', animate('2s'))
])

<div [@showMenu]="showMenuState" id="menu-side-wrapper">
    MENU
    <div id="close-menu">
       CLOSE
    </div>
</div>

Upvotes: 2

Views: 1774

Answers (2)

Bob
Bob

Reputation: 1597

I fixed the exact problem in my project by removing the import of NoopAnimationsModule in my main module. This one seems to mock the animations, but actually doesn't do a thing.

Upvotes: 4

Medha Ch
Medha Ch

Reputation: 36

I've checked the code you've pasted here and it works fine. Could you add any other relevant code? Maybe the code for 'showMenuState'?

Upvotes: 2

Related Questions