JS Countdown not working on safari

Navigation
2

I'm developing a website with a countdown.

The code works fine and the timer starts counting perfectly in Firefox and Chrome, but in Safari the number shows NaN: NaN: NaN

Has anyone ever had this problem?

I'm using Countdown JS: link

Follow the code below:

Policy: 

.directive('tempoPercorrido', function($interval){
            return {
                link: function(scope, element, attrs){
                    var timeNow = new Date(attrs.tempoPercorrido);
                    var units = countdown.DAYS | countdown.HOURS | countdown.MINUTES | countdown.SECONDS;
                    var timespan = countdown(timeNow, null, units, 0, 0);                    
                    function updateTme(){
                        var timespan = countdown(timeNow, null, units, 0, 0);
                        var dias = timespan.days <= 9 ? '0' + timespan.days.toString() : timespan.days.toString();
                        var horas = timespan.hours <= 9 ? '0' + timespan.hours.toString() : timespan.hours.toString();
                        var minutos = timespan.minutes <= 9 ? '0' + timespan.minutes.toString() : timespan.minutes.toString();
                        var segundos = timespan.seconds <= 9 ? '0' + timespan.seconds.toString() : timespan.seconds.toString();

                        var contador = 
                               '<div class="dias circulo">'+ dias + '</div>'+
                               '<div class="horas circulo">'+ horas + '</div>'+
                               '<div class="minutos circulo">'+ minutos + '</div>'+
                               '<div class="segundos circulo">'+ segundos + '</div>';
                        //console.log(timespan);
                        $(element).html(contador);       
                    }

                    updateTme();

                    $interval(function(){
                        updateTme();
                    }, 1000);
                }
            }
        })

Html: 

<div class="horario_banner" tempo-percorrido="2017-09-15 10:00:00"></div>
    
asked by anonymous 17.08.2017 / 14:50

1 answer

1

You do not need to use an external angle lib if you choose to use an external lib, I advise you to use moment.js 

//Variável limit caso o seu contador tenha limite
var limitsegundos = 10
function meuContador(){
        if (limitsegundos <= 0) {
            stop();
            vm.title = "Alerta contador terminou";
            limitsegundos = null;
            //Aqui você pode chamar um evento se quiser


        } else {

            limitsegundos--;
            /*Aqui você pode subtrair a sua variável em 1 segundo em 
            javaScript ou  usando a lib moment.js exemplo:
             dateTime.subtract(1, 'seconds').format('m:ss'); */


            mytimeout = $timeout(meuContador(), 1000);

        } 
var mytimeout = $timeout(meuContador(), 1000);

//Function responsável por parar o contador caso seja necessário:
function stop() {
        $timeout.cancel(mytimeout);
    }

In the View I suggest you use the filter to display the date according to the angularjs date a> 

 <div class="horario_banner" tempo-percorrido="{{seuTempo | date:'yyyy-MM-dd HH:mm:ss' }}"></div>
    
17.08.2017 / 15:58
How to recover several actions from one activity to another? Component on another Android