Here is my app.component.ts:
import { Component } from '@angular/core';
import {MatButtonModule} from '@angular/material/button';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'tour of heroes';
}
This is the content in app.component.html:
<!--This section serves as a placeholder and can be customized.-->
<div style="text-align:center">
<button mat-raised-button>Basic</button>
<h1>
Welcome to {{ title }}!
</h1>
</div>
<ul>
<li>
<h2>
<a routerLink="/history" routerLinkActive="history">Heroes</a>
</h2>
</li>
<li>
<h2>
<a routerLink="/submission-display" routerLinkActive="submission-display">Submissions</a>
</h2>
</li>
</ul>
<router-outlet></router-outlet>
Upon execution, I notice that the browser button appears without any predefined theme.