angular-animations

问题 I have a Carousel animation: which is working fine but I need to pause it after a duration and call a function. As soon as the cards change their position, I want to pause it, call my function, and as soon as the execution of that function is over, again restart the animation. And I want to do this indefinitely. I am creating my animation using AnimationBuilder 's build() function. I tried to make use of AnimationPlayer 's pause() and restart() methods but was not able to set them properly.

问题 I have a Carousel animation: which is working fine but I need to pause it after a duration and call a function. As soon as the cards change their position, I want to pause it, call my function, and as soon as the execution of that function is over, again restart the animation. And I want to do this indefinitely. I am creating my animation using AnimationBuilder 's build() function. I tried to make use of AnimationPlayer 's pause() and restart() methods but was not able to set them properly.

问题 As of right now, the code is working as it should (but now how I want haha). The animation works and fades in when the page initially loads & is first initialized but the animations do not occur when I am accessing routes within the after the initial page fade in. Just wondering how I could implement my animation to each sibling route. Any help is appreciated, thank you! Below are my app component files where I wrote the animation. I then put the trigger into the HTML. app.component.ts

问题 In my Angular component a table shall be displayed line by line, then wait few seconds, remove the table lines and show the next lines. That works well so far. But now I have two "small" issues with the animations: I need to insert a "wait" (see code below) to ensure that the a previous :leave has been finished. Otherwise printing of new lines are overlapping with removing the old lines. The problem is now that this "wait" also is applied on the very first run. How can I avoid that the "wait"

问题 I'm trying to have a stagger animation in a list. Up till now I have managed to have the stagger animation on load. Apart from on load I'd like to have the stagger animation trigger when new items are added to the array. I followed this example: https://medium.com/google-developer-experts/angular-applying-motion-principles-to-a-list-d5cdd35c899e And came up with a quick test: https://stackblitz.com/edit/angular-stagger-animation-test2 In the app.component.ts I define the stagger animation and

问题 I've been beating my head against this problem for quite a while before I got here. Essentially, I have an Angular Material table that uses animations to create a detail row. When the table sorts, it rearranges the data. Some of the detail rows have a transition to void during that process. Afterwards, the detail rows stop playing the animation, even though the animation events are firing. I suspect that MatSort is breaking the animations somehow, but I'm not sure how. Angular Material table:

来源： https://stackoverflow.com/questions/63497254/when-i-use-same-angular-animation-on-child-element-it-doesnt-work

问题 I am using webpack in angular2 and when i try to run my app i get an error stating Cannot find module "@angular/animations" package.json { "name": "angular-quickstart", "version": "1.0.0", "description": "QuickStart package.json from the documentation, supplemented with testing support", "scripts": { "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ", "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first", "lint": "tslint .

问题 I am using webpack in angular2 and when i try to run my app i get an error stating Cannot find module "@angular/animations" package.json { "name": "angular-quickstart", "version": "1.0.0", "description": "QuickStart package.json from the documentation, supplemented with testing support", "scripts": { "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ", "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first", "lint": "tslint .

问题 trigger('expandCollapse', [ state('open', style({ 'height': '*' })), state('close', style({ 'height': '0px' })), transition('open <=> close', animate(1000)) ]) using this code to animate expand collapse, the expand collapse works fine but there is no animation on height using angular animation framework 4.3.1 https://plnkr.co/edit/tY4z1QPvdKMeU6M82cTF?p=preview created a small demo for the same 回答1: The problem is that NoopAnimationsModule . This works: //our root app component import