title: showing only country code in material-select angular
body: <p>I use this in HTML</p>
  
  <pre><code>&lt;mat-form-field style="width: 70px;margin-left: 50px;"&gt;
    &lt;mat-label&gt;Select an option&lt;/mat-label&gt;
    &lt;mat-select (openedChange)="toogleCountry()" [(value)]="selected"&gt;
      &lt;mat-option value="+91"&gt;
        &lt;span&gt;{{"+91"}}&lt;/span&gt;
        &lt;span *ngIf="showCountry"&gt;{{"india"}}&lt;/span&gt;
      &lt;/mat-option&gt;
    &lt;/mat-select&gt;
  &lt;/mat-form-field&gt;
  </code></pre>
  
  <p>and this in component.ts by using (openChange) event of mat-select</p>
  
  <pre><code>showCountry = false;
  toogleCountry() {
        this.showCountry = !this.showCountry;
    }
  </code></pre>
  
  <p>but I am getting the desired result after I remove focus from mat select</p>