Изменить стиль кнопки Угловой материал в зависимости от разрешения - PullRequest
Новая
       23

Изменить стиль кнопки Угловой материал в зависимости от разрешения

0 голосов
/ 05 июня 2018

Мне нужно удалить текст с моей кнопки, если размер экрана небольшой.Что я и сделал, используя Flex API.Мне также нужно изменить стиль кнопки на «mat-mini-fab» с «mat-поднял-button».Как сделать атрибут этой кнопки условным?Например, на маленьком экране следует применить атрибут «mat-mini-fab», иначе «mat-поднял-button».Предпочитая использовать Flex API здесь что-то вроде fxShow fxHide используется для элементов. 

 <button matTooltip="Save" mat-raised-button (click)="saveMember()" color="accent" class="submit-button" aria-label="SAVE" [disabled]="memberForm.invalid">
          <mat-icon>save</mat-icon><span fxHide fxShow.gt-sm>SAVE</span>
 </button>

1 Ответ

0 голосов
/ 05 июня 2018

mat-raised-button и mat-mini-fab являются директивами (фактически они являются частью селектора директив), и директивы нельзя сделать условными.Единственный вариант - использовать разные элементы кнопок для каждого размера экрана директивы / типа и использовать flex api, чтобы отобразить или скрыть их соответствующим образом.Например: 

<button mat-raised-button fxHide fxShow.gt-sm>
    <mat-icon>save</mat-icon>
    SAVE
</button>
<button mat-mini-fab fxShow fxHide.gt-sm>
    <mat-icon>save</mat-icon>
</button>
...