Angular Material Tutorial Part-4

Welcome to Ultimate Angular Material tutorial, this is part4 of angular material tutorial, in this part we will learn following things –
 Toolbar in Angular Material.
 Side Nav in Angular Material.
 Menu in Angular Material.
 Snackbar spinner in Angular Material.
If you did not watch the Angular Material Part –I, II & III, I will recommend you to watch that part here https://www.youtube.com/watch?v=uP45nwae9_M&t=161s
If you did not watch the Angular Material Part –II, I will recommend you to watch that part here https://www.youtube.com/watch?v=TBGre479dAk&t=42s
If you did not watch the Angular Material Part –III, I will recommend you to watch that part here https://www.youtube.com/watch?v=P2mmXZRYvqY&t=42s

How to create toolbar in Angular Material?
Toolbar contains set of buttons, those buttons when clicked will allow you to perform some activity or action. To create the toolbar we use directive - mat-toolbar is a container for headers, titles, or actions used to create navbar.
How to use SideNav in Angular Material?
The sidenav components are designed to add side content to a full screen app. To set up a sidenav we use three components:
mat-sidenav-container which acts as a structural container for our content and sidenav,
mat-sidenav-content which represents the main content
mat-sidenav which represents the added side content.
How to create a menu in Angular Material?
To create a menu we use the directive mat-menu, this directive provides a floating panel containing list of options. Beside this we need directive mat-menu-item to create the items in the main menu. You can trigger the menu using a template reference variable and directive matMenuTriggerFor.
How to create Snack bar in Angular Material?
Snack bar shows a small message at the bottom of UI in a bar. MatSnackBar is a service for displaying snack-bar notifications. It can show one notification at a time. To create a snack bar we need a module – MatSnackBarModule.
TABLE OF CONTENT
0:00:00 Introduction
0:00:10 About Trainer
0:00:35 Agenda
0:0:50. Toolbar in Angular Material (Theory)
0:02:06 Angular Material Toolbar Demo
0:06:41 Sidenav in Angular Material (Theory)
0:11:20. Angular Material Sidenav Demo
0:21:56 Menu in Angular Material (Theory)
0:24:04 Angular Material Menu Demo.
0:29:45 Snack bar in Angular Material (Theory)
0:32:19 Angular Material Snackbar Demo
0:38:55 thank you.

For full fletch Angular 9 & Material course: http://ritechpune.com/AngularJS/Angular_JS_Training_Details

CONNECT WITH ME:-
Website: http:// www.ritechpune.com
Blog: http://www.blog.ritechpune.com
Mail us: contact@ritechpune.com

Видео Angular Material Tutorial Part-4 канала RI-TECH by Achyut Kendre