В IE / Edge mat-slide-toggle кнопка с иконками не работает должным образом - PullRequest
0 голосов
/ 21 июня 2019

Я сделал индивидуальный дизайн для установки значков на кнопке переключения.

HTML: Вот HTML-код:

 `<mat-slide-toggle class="pos-rel-toggle m-x-10 m-b-30" (click)=onStarclick()> `
 <mat-icon matSufffix class=" home toggle-icons"*ngIf="toggleBtn">home</mat-icon>
 <mat-icon matPrefix class="setting toggle-icons" *ngIf="!toggleBtn"> settings</mat-icon></mat-slide-toggle>

SCSS: Scss ниже здесь:

 ` .pos-rel-toggle { position: relative; }
 .toggle-icons {position: absolute; color: $white-color;font-size: 19px; z- index: 1;}
 .setting { top: 3px; right: 22px; }
 .home { top: 1px;right: 6px; }` 

ts: TS для этого здесь:

   `onStarclick(){
    this.toggleBtn=!this.toggleBtn;
    this.toggleBtn? this.router.navigate(['/dashboard/setting']):this.router.navigate(['/dashboard'])
  }`

Здесь я добавил изображения, касающиеся проблемы и рабочего переключения в IE.

Изображение рабочего переключателя:

Wroking toggle img

Проблема в IE / Edge:

Issue in IE/Edge

Рабочий переключатель:

Working toggle

...