router link attribute within the button tag doesnt work

Question

I am unable to navigate with router link attribute that is placed within the button tag. Here is my code,

<button mat-raised-button color="primary"><a routerLink="/message-inbox">Inbox</a></button>
    <button mat-raised-button color="accent"><a routerLink="/sent">Sent</a></button>
    <a routerLink="/message-compose"><button color="warn">Compose</button></a>

Answer 1

You can apply routerLink to the button directly. It doesn't have to be an <a element

<button mat-raised-button color="primary" routerLink="/message-inbox">Inbox</button>