Stack Overflow
Stack Overflow

Questions tagged [angular2-animation]

81 questions
0
votes
1 answer

How can I do a crossfade with angular animate and ngFor?

I'm triggering an animation when I update the collection I pass into *ngFor: //JS state : string = 'a'; colors = { a: ['red','blue','green','yellow'], b: ['orange'] } public onClick (){ this.state = this.state === 'a' ? 'b' :…
adamdport
  • 11,687
  • 14
  • 69
  • 91
0
votes
1 answer

Angular - animate using transform but don't apply position absolute when the animation is finished

So I'm trying to apply some slick animations and they work kinda great but not so much since they break layout a lot. The problem is that I need to use position: absolute when animating so that I can use transform, as seen here: export function…
Chrillewoodz
  • 27,055
  • 21
  • 92
  • 175
0
votes
0 answers

Manage state of animation trigger in angular2 routing

I am faceing an issue with angular2 animation. App has a guide system where User navigate from step 1 to step 2 and so on. Now i have animation on routing where my first component slide to left and second come from right side and this is same for…
Jorawar Singh
  • 7,463
  • 4
  • 26
  • 39
0
votes
1 answer

Angular : Animation complete callback

I know about (@myTrigger.done) event, but it fires every time even if the animation is interrupted and not completed. I want to create a sequence of animations for one popup component where the popup slides from the right side of the window and…
HirenParekh
  • 3,655
  • 3
  • 24
  • 36
0
votes
2 answers

How to update the angular 2 animation status after component init

I have a simple dropdown component that i want to animate. The problem is that despite the fact that the variable that controls animation state starts with the value "inactive" and my dropdown still appears when the component loads and only takes…
Dmitrij Kostyushko
  • 636
  • 1
  • 8
  • 20
0
votes
1 answer

Angular 2 - controlling animation keyframes

I'm trying to find a way to control CSS3/ angular 2 animations. For example, look at the following code from the offical angular 2 animation docs with some changes: animations: [ trigger('flyInOut', [ state('in', style({position: 'absolute',…
TheUnreal
  • 23,434
  • 46
  • 157
  • 277
0
votes
1 answer

angular 2 animation. Styles does not apply during the transition

I am trying to create a sidenav menu with different directories at hierarchical structure. It has two animations one of roteiting the pointer that displays whether or not the directory is open, and an animation sliding down at opening of child…
Voland Mortes
  • 95
  • 7
0
votes
1 answer

ng2-page-scroll not working

I have a angular 2 app where I'm trying to implement a very simple animated scroll, using ng2-page-scroll. According to the read.me, I should be able to npm install it, Import it to my module.ts file and then user the directive. I've done all of…
cnak2
  • 1,711
  • 3
  • 28
  • 53
0
votes
1 answer

Angular 2 Is there a way to get access to the component logic or element style value inside animation metadata

Basically what i need to know is is there a way to calculate the height of the component that is dynamically created from the recursive tree. So obviously i cannot use tree inside my metadata declarations but i can calculate it height inside the…
Voland Mortes
  • 95
  • 7
0
votes
1 answer

Angular 2 animate a specific targeted element

I have 2 components: One which contain arouter-outlet where will be injected pages with a question and 3 possible answers Second that is a sort of preview, that contains 20 boxes I use a shared service(BehaviorSubject) for components…
sTx
  • 1,213
  • 13
  • 32
0
votes
1 answer

Angular2 Animations: Toggle State Triggers on Every *ngFor Rather Than The One Clicked

I am making some expandable panels using Angular2 and Material Design Lite. I have followed the tutorial on the Angular2 site, but when one panel is clicked, the expandable panel on every item is triggered. This is my code: animations:…
user3722622
0
votes
1 answer

Animate child element in Angular 2 animation

Here is my template
Hello_Everyone
As you can see there is span element within the div containing an underscore between…
Giridhar Karnik
  • 2,213
  • 4
  • 27
  • 47
0
votes
1 answer

Angular routing animations play sporadically on mobile Chrome

I got routing animations set up for all pages of my app, that is, every component that can be routed to has @Component({ selector: '...', templateUrl: '...', styleUrls: ['...'], animations: [ trigger('flyInOut', [ …
Thorsten Westheider
  • 10,572
  • 14
  • 55
  • 97
0
votes
1 answer

Angular2 animation with bootstrap

I have a row divided in 3 columns with 2 buttons to hide the right and left panels : col-md-3 col-md-7 col-md-2 ------------------------------------ | | | | | left | middle panel | | <= right…
Morgan
  • 476
  • 9
  • 23
0
votes
1 answer

Ionic 2 animations (with Angular2) => colors from variable.scss, `Failed to execute 'animate' on 'Element': Partial keyframes are not supported

This question is similar to this one but different enough to make a new thread. While working on angular 2 animations, I could not figure out how to access the colors variables that are located in [project]\src\theme\variable.scss. Let's say…
nyluje
  • 3,573
  • 7
  • 37
  • 67
1 2 3 4
5
6