Как сделать так, чтобы иконка работала аналогично кнопке в угловых 5/6? - PullRequest
Новая
       6

Как сделать так, чтобы иконка работала аналогично кнопке в угловых 5/6?

0 голосов
/ 27 декабря 2018

Я пишу код для редактирования имен в информации об учетной записи, и кнопка работает нормально, но я хочу кнопку редактирования в виде значка (карандаш).Иконка не поддерживает ngIf, есть ли альтернатива?(Угловой 5/6) Мой код выглядит следующим образом: 

<div>
   <mat-form-field class="example-full-width" *ngIf="edit">
    <input matInput placeholder="Enter name . [(ngModel)]="name">
   </mat-form-field>
   <span *ngIf="!edit">Name : {{name}}</span>
</div>
<div class="example-button-row">
   <button mat-raised-button color="primary" *ngIf="!edit" 
    (click)="onEdit()">Edit</button>
   <button *ngIf="edit" mat-raised-button color="primary" 
    (click)="onEdit()">Submit</button> 
</div>

Вывод кода:

The Code Output

Ответы [ 2 ]

0 голосов
/ 27 декабря 2018

:) добавив его к ответу, сделайте это!Просто поместите значок внутри тега кнопки так: 

<button
    mat-raised-button
    color="primary"
    (click)="onEdit()">
    <span *ngIf="!edit">Edit</span>
    <span *ngIf="edit" > Put your icon here </span> 
</button>
0 голосов
/ 27 декабря 2018

Как указала Ума, вы можете просто поместить матовый значок внутри кнопки.

Пожалуйста, см. Пример кода ниже: https://stackblitz.com/edit/mat-button-icon-example

...