title: Angular Material outlined input and ngx-translate
body: <p>I have an Angular app ^6.0.0 with Angular Material ^6.0.2 and ngx-translate ^10.0.2.</p>
  
  <p>In my app, I have some mat-inputs with appearance="outline". Whenever I change the language of the app, the input label truncates with the field outline, as in the screenshot below.</p>
  
  <p>If I refresh the page the outline takes the width of the current language and it works as is should.</p>
  
  <p>Is there any way to refresh/rebuild only the inputs when I change the language, without having to refresh the page?</p>
  
  <p>Thanks!</p>
  
  <p>Label normal in french:</p>
  
  <p><a href="https://i.stack.imgur.com/TJ452.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TJ452.png" alt="Label normal in french"></a></p>
  
  <p>Label truncates with outline in English:</p>
  
  <p><a href="https://i.stack.imgur.com/u6lmr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/u6lmr.png" alt="Label truncates with outline in English"></a></p>