This media is not supported in your browser
VIEW IN TELEGRAM
β³οΈ Implementing a Loading Skeleton in Angular
#angular #directive #skeleton #ui_element
Skeletons are placeholder elements that are displayed before the actual content is loaded on a webpage. A skeleton is usually a light gray box or circle that you see on websites like Medium, YouTube, etc. Skeletons convey a visual impression of the feature, which gives them an advantage over spinners.
β Article Link: https://netbasal.com/implementing-a-loading-skeleton-in-angular-7490ffdecc1b
π Code Link:
Step 1: https://gist.github.com/NetanelBasal/33f8ec9a106ee2367f3b9847fd3043cb#file-rect-ske-component-ts
Step 2: https://gist.github.com/NetanelBasal/82030b63d6ed0055c09a543483bd3470#file-skeleton-directive-ts
Step 3: https://gist.github.com/NetanelBasal/0f26e85d13d10a9e564541553094c12f#file-skeleton-demo-html
#angular #directive #skeleton #ui_element
Skeletons are placeholder elements that are displayed before the actual content is loaded on a webpage. A skeleton is usually a light gray box or circle that you see on websites like Medium, YouTube, etc. Skeletons convey a visual impression of the feature, which gives them an advantage over spinners.
β Article Link: https://netbasal.com/implementing-a-loading-skeleton-in-angular-7490ffdecc1b
Step 1: https://gist.github.com/NetanelBasal/33f8ec9a106ee2367f3b9847fd3043cb#file-rect-ske-component-ts
Step 2: https://gist.github.com/NetanelBasal/82030b63d6ed0055c09a543483bd3470#file-skeleton-directive-ts
Step 3: https://gist.github.com/NetanelBasal/0f26e85d13d10a9e564541553094c12f#file-skeleton-demo-html
Please open Telegram to view this post
VIEW IN TELEGRAM
π€ Create Reusable
#angular #ngTemplateOutlet #ui_element
The goal is to make a reusable component that can be shared across the app and is highly configurable by the parent component.
β Article Link:
https://medium.com/null-exception/building-angular-reusable-components-using-ng-template-ngtemplateoutlet-ngtemplateoutletcontext-f8813b67cd1f
π Code Link:
1. https://gist.github.com/vikas0sharma/ddff8060b8c2d9275eac75b009fdfbf1#file-data-table-component-ts
2. https://gist.github.com/vikas0sharma/8ceb9b1ecfd08fa710d802351ab5bcf5#file-data-table-component-html
3. https://gist.github.com/vikas0sharma/3ecfa0913dcb4e14e8b99f43fa915c94#file-employess-component-ts
4. https://gist.github.com/vikas0sharma/4b66b931499fc587ca09a15ff55a92ad#file-employees-component-html
DataTable Component#angular #ngTemplateOutlet #ui_element
The goal is to make a reusable component that can be shared across the app and is highly configurable by the parent component.
β Article Link:
https://medium.com/null-exception/building-angular-reusable-components-using-ng-template-ngtemplateoutlet-ngtemplateoutletcontext-f8813b67cd1f
1. https://gist.github.com/vikas0sharma/ddff8060b8c2d9275eac75b009fdfbf1#file-data-table-component-ts
2. https://gist.github.com/vikas0sharma/8ceb9b1ecfd08fa710d802351ab5bcf5#file-data-table-component-html
3. https://gist.github.com/vikas0sharma/3ecfa0913dcb4e14e8b99f43fa915c94#file-employess-component-ts
4. https://gist.github.com/vikas0sharma/4b66b931499fc587ca09a15ff55a92ad#file-employees-component-html
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
π1
π Implementing a masking strategy on
#angular #ui_element
β Article link: https://medium.com/@shahzadjavaidisb/implementing-a-masking-strategy-on-ngbdatepicker-angular-d47cada589f2
ngbDatePicker#angular #ui_element
β Article link: https://medium.com/@shahzadjavaidisb/implementing-a-masking-strategy-on-ngbdatepicker-angular-d47cada589f2
π Angular Simple Tabs
#angular #ContentChildren #ngTemplate #ui_element
β Article link: https://javascript.plainenglish.io/angular-template-powers-4-7ffc219d2db0
π Code link: https://stackblitz.com/edit/stackblitz-starters-4e6zq8?file=src%2Fmain.ts
#angular #ContentChildren #ngTemplate #ui_element
β Article link: https://javascript.plainenglish.io/angular-template-powers-4-7ffc219d2db0
Please open Telegram to view this post
VIEW IN TELEGRAM