角度为 8 的秒表 [关闭]

Posted

技术标签:

【中文标题】角度为 8 的秒表 [关闭]【英文标题】:Stopwatch in angular 8 [closed] 【发布时间】:2020-11-26 17:17:23 【问题描述】:

我需要一个秒表,以 hh:mm:ss 格式显示时间

【问题讨论】:

见Tried to add a self-answered wiki-post, but just got downvotes 【参考方案1】:

这是我研究了一段时间但没有找到我想要的确切类型后制作的秒表。希望这可以帮助有同样问题的人。时间以 hh:mm:ss 格式显示在屏幕上,如果需要更改在 getDisplayTimer() 方法中

import  timer  from 'rxjs';

//timer
  public displayTimer;
  public isRunning: boolean = false;
  public startText = 'Start';
  public time;

ngOnInit(): void 
    this.time = 0;
  

 toggleTimer() 
    this.isRunning = !this.isRunning;
    this.stopwatch();
  

 stopwatch() 
    timer(0, 1000).subscribe(ellapsedCycles => 
      if (this.isRunning) 
        this.time++;
        this.getDisplayTimer(this.time);
        this.startText = 'Pause';
       else 
        this.startText = 'Start';
      
    );
  

getDisplayTimer(time: number) 
    var hours = '' + Math.floor(time / 3600);
    var minutes = '' + Math.floor(time % 3600 / 60);
    var seconds = '' + Math.floor(time % 3600 % 60);

    if (Number(hours) < 10) 
      hours = '0' + hours;
     else 
      hours = '' + hours;
    
    if (Number(minutes) < 10) 
      minutes = '0' + minutes;
     else 
      minutes = '' + minutes;
    
    if (Number(seconds) < 10) 
      seconds = '0' + seconds;
     else 
      seconds = '' + seconds;
    

    this.displayTimer = hours + ':' + minutes + ':' + seconds;
  

 <div class="row">
                <div class="col-lg-4 m-b-30">
                    <section class="timer-counter-label">
                        <div *ngIf="displayTimer; else elseBlock">  displayTimer </div>
                        <ng-template #elseBlock> 00:00:00 </ng-template>
                    </section>
                    <section class="timer-button-container">
                        <button class="btn btn-outline-light" (click)="toggleTimer()">
                             startText 
                        </button>
                    </section>
                </div>
            </div>

【讨论】:

以上是关于角度为 8 的秒表 [关闭]的主要内容,如果未能解决你的问题,请参考以下文章

不那么冗长的秒表[关闭]

如何在 Apple Watch(iOS)上创建秒表(计时器)[关闭]

如何在有角度的[关闭]的firebase中使用Json服务器

在高分辨率下默认关闭离子菜单 |角度和离子 4

从角度组件关闭电子应用程序

选中角度复选框时无法关闭模式