Angular Material Subheader

Angular Material Subheader: It is very simple and easy to create a stickey header in Angular Material. md-subheader directive is used to create subheaer. Here in this tutorial we are going to explain how you can create Subheader in Angular Material. You can also use our online editor to edit and run the code online.

Angular Material Subheader Example

Let us create a simple example for Angular Material Subheader. You can subheader in any section simply as below –

<md-subheader>Subheader Text</md-subheader>

By default the subheader will be sticky, if you want to disable the sticky header you can add the class class=”md-no-sticky” to the directive md-subheader.

If you run the above example it will produce the output something like this –

Angular Material Disable Stickiness of Subheader

Sometimes we need to disable stickiness of the subheader, to disable the stikiness of subheader just add the following the class=”md-no-sticky” to the subheader directive.
Here is an example to disable the stikiness of the subheader –

<md-subheader class="md-no-sticky">Stikiness Disabled Subheader</md-subheader>

Add Comment

📖 Read More

• 1. Angular Material Switch
• 2. Angular Material Tooltip
• 3. Angular Material Tabs
• 4. Angular Material Toolbar
• 5. Angular Material Toast