Learn Angular Animations with 5 Examples
Вставка
- Опубліковано 9 лип 2024
- In this episode, I show you my top 5 concepts you should know when building animations with Angular 4.3+. Get the full lesson code: angularfirebase.com/lessons/a...
Also, check out the official docs angular.io/guide/animations - Наука та технологія
Best animation tutorial, thanks for posting them up!
Great video, i am having trouble finding how to activate staggered animations one after the other manually not automatically ?
sooo clear really helping
Very nice video, it actually helped me finish a task at work, love your channel. Keep up the good work
p.s. Can you make a video about open cv and text recognition?
Straight in to the point!, Impressive!
Awesome vide! Thanks a lot
Keep it up bro... Nice videos more content..no boring at all
Great video!
While some may disagree, I like the pacing of your video. In addition, you verbalize your explanations perfectly. I much rather get a quick overview & spend the next 20-30 minutes on the formal documentation, than follow an unnecessarily thorough project walkthrough.
so great! I like it. But I just want a deep dive about
can you share your nav menu stylesheet? thanks
This tut is so good it makes me moist.
I'm honored :)
Thanks! Quick and easy to follow tutorial.
Is there an easy way to print out the state in the transition instead/in addition to using it for styling?
I have a fake progress bar, and I want to print out the number 10%/100% (Which also is the style width )
can the stagger be random like the GSAP random stagger animation ?
Does anyone know how to implement zoom out for image?
Loving these lessons, thanks for posting them up!
I have run in a bit of a problem, it seems that when I'm trying to apply animations to async lists from Firebase it is triggering the animation before the list has been retrieved from Firebase.
Have you run into anything like this before?
I've just started playing around with Animations but I'm guessing the solution involves triggering the animation when the promise for the list is completed? Maybe I should be using a static method to generate the list?
Just throwing this out there because I suspect others will run into a similar problem.
Interesting... You can pass {optional:true} to query, which will prevent errors if the list is not populated. Also, you might want to hide the parent div with *ngIf="(list | async)?.length > 0". I have not tested this, but it may solve the problem. Please join our slack team so we can chat in more detail join.slack.com/t/angularfirebase/shared_invite/MjA2NTgxMTI0MTk2LTE0OTg4NTQ4MDAtMjhhZDIzMjc0Mg
Thanks! That's a very generous offer! I will do but not right now, it's 11:30 PM local time.
Just FYI I tried the {optional: true} argument at the end of the query and it does suppress the error message but doesn't fix the behavior.
Thanks, I will play around with this code and do a follow-up video for firebase-specific animations.
I just know I wasn't going any sleep before trying both of your suggestions.. ;)
Your *ngIf solution worked a treat! Thanks!
I assume this is because Angular4 doesn't evaluate any code inside the parent div until the *ngIf statement is satisfied?
Awesome, thanks for confirming. Correct, the animation query code will not run until the ngIf evaluates to true.
Jeff is my favourite tech youtuber!
is it possible to run an infinite animation?
hey can u do something about angular typing animation
Personally I prefer the pace of this video rather than a 30 minute explanation. I feel that the official angular documentation would give you a full picture of what animations are while this video will give you working examples on how to implement those animations
thanks
Best lessons are only posted on this blog, but I saw that one dislike in every video only one. whose that black sheep
does premium account contain additional codes and videos ?
The vidoes are always posted to youtube, but you get full access to the code with additional written commentary. Check out all the benefits here: angularfirebase.com/pro/
zaharouni1 jjkkkkkjnkkkmmmmmmmmmmmmmmmmmmnjn
All thos stuff and it doesnt work
Your videos move way too fast. Maybe great for very experienced developers but I bet you'd have a larger audience if you explained your steps more thoroughly. For example, at 0:47, I had to pause it a the exact moment your pasted your snippet because half a second later you scrolled away from the code. Other than the fast narration, there is no advantage to watching the videos versus copying and pasting code posted on the web. I know this comment is critical but I also want to say thanks for making so much content. If you can take what I said into consideration I'm sure many viewers will appreciate your added effort.
He also forgot to show the actual code for animation within @component. I like the fast paced video;s but they need to be clear and complete otherwise you leave people frustrated.
shows us a ferrari but delivers fiat ...
I hear you. I've become much more considerate about the pacing on more recent videos.
don't learn animations. learn the basics first
@@Fireship I understand where these comments are coming from, but as an intermediate dev looking to learn a new topic, I really loved the concision. It's too rare nowadays and I thought you handled it well.
bet this tutorial has a .5ms transition. too fast.
what the....? am i the only one who finds it way toooo fast paced 😬
Look at Angular documentation BEFORE watching this video and you will understand well.
he didnt explain anything...very bad tutorial