without writing media queries How to make responsive component
Follow these steps to implement a responsive design with Angular: go to main refrence use the Angular BreakpointObserver to detect the size of the current device set member variables in your component that allow you to show or hide certain elements depending on the screen size Set responsive CSS classes in your component like is-phone-portrait depending on the screen size Use these special classes to make the CSS of your component responsive without writing media queries In this post, we will cover the following topics: The BreakpointObserver Service Using layout-related flags to show or hide responsive elements Writing CSS that only applies to certain screen sizes (without media queries) Summary let's get started learning everything that we need to know for making your Angular application responsive! The BreakpointObserver Service @ Component ( ) export class ResponsiveComponent implements OnInit { constructor ( private responsive : BreakpointObser...