如何在Angular-4中的md-progress-spinner中设置文本

2 angular-material2 angular

在Angular-4中,我正在设置进度微调器

 <md-progress-spinner [color]="color" [mode]="mode" [value]="value" aria-label="Rating">Rating</md-progress-spinner>
Run Code Online (Sandbox Code Playgroud)

和ts中的值:

  color = 'warn';
  mode = 'determinate';
  value = 50;
  showText='Rating';
Run Code Online (Sandbox Code Playgroud)

但是我想在进度条中设置一些文本,我尝试使用angular-2方法但是它在Angular-4中不起作用可以请任何人告诉我它是如何在Angular-4中完成的

Angular-2方法是设置 [showText]='showText'

Fai*_*sal 8

材料2中没有此功能.您需要手动创建它.您可以将<mat-progress-spinner>内部放置一个<div>并在其中添加另一个<div>以显示文本并手动调整位置:

<div>
    <mat-progress-spinner [color]="color" 
                        [mode]="mode" 
                        [value]="value" 
                        aria-label="Rating">
    </mat-progress-spinner>
    <div style="position:relative; top: -60px; left: 30px;">Rating</div>
</div>
Run Code Online (Sandbox Code Playgroud)

链接到stackblitz演示.

  • 这个stackblitz演示不起作用 (5认同)