Angular πŸ‡ΊπŸ‡¦ - practical notes
1.63K subscribers
1.6K photos
1 file
532 links
Angular - practical notes

This group is for posting practical notes for Angular developers. Mostly all posts are for quick implementation https://t.me/angular_practical_notes (Commenting on posts only in ENG and UA langs here). Welcome!
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
❀️ πŸ€“ Angular Animations Functions

#angular #animations #ui_element

Example explanation:

Triggers (trigger):
parentTrigger: Defines animations for the parent element.
childTrigger: Defines animations for the child elements.

States (state):
parentTrigger: Has the states start and end.
childTrigger: Has the states visible and hidden.

Styles (style):
Defines final and intermediate styles for different states and transitions.

Transitions (transition):
Defines how the animation should occur between states.

Animate (animate):
Defines the duration and timing function of the animations.

Keyframes (keyframes):|
Used in the transition from visible to hidden in the child elements to create detailed intermediate animations.

Group (group):
Used in the transition from start to end in parentTrigger to animate multiple properties in parallel.

Sequence (sequence):
Used in the transition from end to start in parentTrigger to animate multiple properties in sequence.

Query (query):
Used in the transition from hidden to visible in childTrigger to select and animate child elements.

Stagger (stagger):
Used with query to apply a delay between the animations of the child elements, creating a cascading effect.


βœ… Article link 🎁 Code Link
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘2
This media is not supported in your browser
VIEW IN TELEGRAM
πŸ’œ πŸ†š Angular Animations: Animating Multiple Items in Parallel

#angular #animations #ui_element

βœ… Article link | 🎁 Code link
Please open Telegram to view this post
VIEW IN TELEGRAM
🚳 JavaScript Design Pattern: Builder

#js #patterns #ui_element

βœ… Article link
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘1