title: How to create a custom arrow in the material table Angular 5
body: <p>I am new to the Angular Material. Is there any way to override the mat-header-arrow in the material table. I have tried to make the mat-sort-header-container to display: none. But unfortunately it didn't work. <br/>
  <br/>
  Current Behavior:</p>
  
  <p><a href="https://i.stack.imgur.com/QOw0P.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QOw0P.png" alt="Current Behavior:"></a> </p>
  
  <p>Expected Behavior:</p>
  
  <p><a href="https://i.stack.imgur.com/tvUVK.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/tvUVK.png" alt="enter image description here"></a></p>
  
  <p>Any help is highly appreciated.</p>
  
  <p>Thanks</p>