Есть ли способ сделать элемент mat-menu таким же, как размер кнопки mat при нажатии? - PullRequest
0 голосов
/ 25 сентября 2019

Я хотел бы сделать так, чтобы при нажатии кнопки циновки пункты меню имели одинаковый размер и давили все остальное вниз.Ниже прилагаются изображения текущей ситуации и желаемого.

Текущее закрытое раскрывающееся меню

Текущее открытое раскрывающееся меню

Желаемый закрытый выпадающий список

Вот мой HTML-код:

<mat-footer>
  <div class="footerLinks">
    <span *ngFor="let footerLink of footerContent.footerLinks">
      <span *ngIf="footerLink.footerDrop.length > 1 else single">
        <a mat-button [matMenuTriggerFor]="subLinks" href="javascript:void(0)" title={{footerLink.subFooterTitle}}>{{footerLink.subFooterTitle}}
          <mat-icon>arrow_drop_down</mat-icon>
          </a>
        <mat-menu #subLinks="matMenu" arrowPosition="up">
          <a mat-menu-item *ngFor="let footerDrop of footerLink.footerDrop" href={{footerDrop.subLink}} target={{footerDrop.linktarget}} title={{footerDrop.footerSubTitle}}>{{footerDrop.footerSubTitle}}</a>
        </mat-menu>
      </span>
      <ng-template #single >
        <a mat-button *ngFor="let footerDrop of footerLink.footerDrop" href={{footerDrop.subLink}} target={{footerDrop.linktarget}} title={{footerDrop.footerSubTitle}}>{{footerDrop.footerSubTitle}}</a>
      </ng-template>
    </span>
  </div>
  <div class="social">
    <span *ngFor="let socialLink of footerContent.socialLinks">
      <a mat-flat-button class="{{socialLink.socialMediaService}}-icon" href={{socialLink.url}} title={{socialLink.socialMediaService}} target={{socialLink.linktarget}}></a>
    </span>
  </div>

  <div class="terms">
    <mat-copywrite-footer [innerHTML]="footerContent.finePrint.value"> </mat-copywrite-footer>
  </div>
</mat-footer>
...