SHARE
TWEET

Untitled

a guest Oct 21st, 2019 75 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import { Component } from '@angular/core';
  2.  
  3. @Component({
  4.   selector: 'my-app',
  5.   templateUrl: './app.component.html',
  6.   styleUrls: [ './app.component.css' ]
  7. })
  8. export class AppComponent  {
  9.   name = 'Angular 6';
  10.   time: number = 3570;
  11.   tmpTime: number;
  12.   day: number;
  13.   hour: number;
  14.   minutes: number;
  15.   seconds: number;
  16.   interval;
  17.  
  18.   startTimer() {
  19.     this.interval = setInterval(() => {
  20.       this.time++;
  21.       this.tmpTime = this.time;
  22.     this.day = Math.floor(this.tmpTime / (3600*24));
  23.     this.tmpTime  -= this.day*3600*24;
  24.     this.hour = Math.floor(this.tmpTime / 3600);
  25.     this.tmpTime  -= this.hour*3600;
  26.     this.minutes = Math.floor(this.tmpTime / 60);
  27.     this.tmpTime  -= this.minutes*60;
  28.     },1000)
  29.   }
  30.  
  31.   pauseTimer() {
  32.     clearInterval(this.interval);
  33.   }
  34.  
  35.   resetTimer() {
  36.     this.time = 0;
  37.   }
  38. }
  39.  
  40. _______________________
  41.  
  42. <hello name="{{ name }}"></hello>
  43. <p>
  44.   Start editing to see some magic happen :)
  45. </p>
  46.  
  47. <button (click)='startTimer()'>Start Timer</button>
  48. <button (click)='pauseTimer()'>Pause</button>
  49. <button (click)='resetTimer()'>Reset</button>
  50.  
  51.  
  52. <p>{{time}}</p>
  53.  
  54. <div *ngIf="time > 0">
  55. <p *ngIf="tmpTime >= 0 && minutes == 0 && hour == 0 && day == 0 ">
  56. {{tmpTime}} Seconds
  57. </p>
  58. <div *ngIf="tmpTime >= 0 && minutes > 0 && hour == 0 && day == 0">
  59.   <div [ngPlural]="minutes">
  60.   <ng-template ngPluralCase="=1">{{minutes}} Minute, {{tmpTime}} Seconds</ng-template>
  61.   <ng-template ngPluralCase="other">{{minutes}} Minutes, {{tmpTime}} Seconds</ng-template>
  62. </div>
  63. </div>
  64. <div *ngIf="tmpTime >= 0 && minutes >= 0 && hour > 0 && day == 0">
  65.     <div [ngPlural]="hour">
  66.   <ng-template ngPluralCase="=1">{{hour}} Hour, {{minutes}} Minutes, {{tmpTime}} Seconds</ng-template>
  67.   <ng-template ngPluralCase="other">{{hour}} Hours, {{minutes}} Minutes, {{tmpTime}} Seconds</ng-template>
  68. </div>
  69. </div>
  70. <div *ngIf="tmpTime >= 0 && minutes >= 0 && hour >= 0 && day > 0">
  71.       <div [ngPlural]="day">
  72.   <ng-template ngPluralCase="=1">{{day}} Day, {{hour}} Hour, {{minutes}} Minutes, {{tmpTime}} Seconds</ng-template>
  73.   <ng-template ngPluralCase="other">{{day}} Days, {{hour}} Hour, {{minutes}} Minutes, {{tmpTime}} Seconds</ng-template>
  74. </div>
  75. </div>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top