Угловой мат-меню материала, повторяющее внутренний компонент несколько раз

У меня есть приложение Angular 6, использующее материал angular, на котором у меня есть меню mat, содержащее компонент (app-login):

<button [matMenuTriggerFor]="menu" mat-icon-button>
  <mat-icon>person</mat-icon>
</button>
<div MatMenuPanel>
  <mat-menu #menu="matMenu" [overlapTrigger]="false">
    <ng-template matMenuContent>
      <app-login></app-login>
    </ng-template>
  </mat-menu>
</div>

Проблема в том, что если я несколько раз нажму кнопку триггера, вход в приложение будет отображаться / добавляться несколько раз, поэтому в конечном итоге я получаю меню с повторным входом в приложение несколько раз.