title: Countdown on Ionic 2
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>ionViewDidEnter() {
  
  //----------------------------------------------------------------------LISTAGEM ALMOÇOS-------------------------------------------------------------------------------------- 
          let data = JSON.stringify({id: this.id});
          let link = *;
          this.http.post(link,data)
              .map(res =&gt; res.json())
              .subscribe(data=&gt;{
                  console.log(data);
                this.almocos = [];
                //IDs das conversas
                for (var a = 0; a &lt; data.length; a++){
                  this.foto2 = data[a][2];
                  if(Number.isInteger(data[a][7])){
                    console.log(data[a][7])
                    this.tempo[0] = data[a][7] + "dias"
                    this.tempo[1] = "";
                    this.tempo[2] = "";
                  }else {
                    this.tempo = data[a][7].split(":");
                    this.tempo[0] = this.tempo[0] + ":";
                    this.tempo[1] = this.tempo[1] + ":"
  
                  }
                
                    
                  
                  this.tempos = [];
                  this.foto =[];
                  let cor;
                    let pessoas;
                    let forma;
                 if (data[a][4].length == 1){
                   if(data[a][5]== this.nome){
                     data[a][2]= data[a][4][0][1]
                   }
                   pessoas = data[a][4][0][0];
                   this.foto.push(data[a][4][0][1]);
                 } else if (data[a][4].length == 2) {
                   pessoas = data[a][4][0][0] + " e " + data[a][4][1][0];
                    this.foto.push(data[a][4][0][1]);
                     this.foto.push(data[a][4][1][1]);
                 } else {
                   pessoas = data[a][4][0][0] + " e " + (data[a][4].length-1) + " pessoas"
                    for (var i = 0; i &lt; data[a][4].length; i++){ 
                       this.foto.push(data[a][4][i][1]);
                    }
                 }
                
  
                 if(data[a][4].length &gt; 1){
                   if(data[a][6] == 1){
                     data[a][2] = "social.png";
                     cor= "#e73C58";
                     forma = "S"
                   } else if (data[a][6] == 2){
                     data[a][2] = "profissional.png";
                      cor= "#1ab2bc";
                      forma = "P";
                   }else if (data[a][6] == 3){
                     data[a][2] = "academico.png";
                     cor= "#9b59b6";
                     forma = "A";
                   }
                 }else{
                   if(data[a][6] == 1){
                      cor= "#e73C58 ";
                      forma = "S"
                    } else if (data[a][6] == 2){
                      cor= "#1ab2bc ";
                      forma = "P";
                    }else if (data[a][6] == 3){
                     cor= "#9b59b6";
                     forma = "A"
                    }
  
                  }
                  
                    this.cores = "#ffffff";
                    
                   
               
                    this.almocos.push(    
                      {
                        id : data[a][0],
                        dia : data[a][1],
                        foto :  data[a][2],
                        foto_anf: this.foto2,
                        estrelas : data[a][3],
                        pessoal : pessoas,
                        tipo : cor,
                        forma :forma,
                        fotos : this.foto,
                        segundo :  this.tempo[2],
                        minuto :  this.tempo[1],
                        horas : this.tempo[0]
                      });
  
                    
                    
  
             setInterval(function(){ 
               console.log("segundos");
               let segundos;
               let minutos;
               let hora;
  
               segundos--;
  
                if (segundos == 0){
                segundos = 60;
                 minutos--;
                 
                }
                if (minutos == 0){
                minutos = 59;
                  hora--;
                } 
                segundos-- ;
                this.tempos = [];
               this.tempos.push(segundos);
              }, 1000);
  
              
             
                }
                 
                
          
              }, error =&gt;{
                console.log("erro")
              });
  //----------------------------------------------------------------------FIM LISTAGEM ALMOÇOS--------------------------------------------------------------------------------------
  
  
    }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;div style="float:right;position:relative;left:0px;position:relative;top:3px"&gt;
                              &lt;span&gt;&lt;ion-icon style="font-size:14px;" name="md-time"&gt;&lt;/ion-icon&gt;&lt;span style="font-size:13px;position:relative;bottom:1px;margin-left:2px"&gt; {{almoco.horas}}{{almoco.minuto}}{{almoco.segundo}} &lt;/span&gt;&lt;/span&gt;
  
              &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>The variables are hours, minutes and seconds. Each is related to a date in the database, where we get the time remaining. I'd like to be able to show in real-time a countdown until the actual date.</p>
  
  <p>I know it's possible via Observable, but I can't figure out how. An answer with integer variables (e.g. hours= 23; minutes=14; seconds=19) would be ideal, so I can just attribute the values from the database.</p>
  
  <p>Thanks in advance!</p>