DOM не обновляется при обновлении модели

Я использую Rivets.js для создания таймера обратного отсчета. Первоначальный таймер обратного отсчета, но он не уменьшается каждый раз, когда вызывается setInterval. Зачем?DOM не обновляется при обновлении модели

Javascript:

function startTimer(minutes) { 
    var countdown = (60 * minutes)-1; 
    rivets.bind($('#timer'), { countdown: countdown }); 

    var timer = setInterval(function() { 

     countdown--; 

     if (countdown < 0) { 
      clearInterval(timer); 
     } 
    }, 1000); 
}

HTML:

<div id="timer">{countdown}</div>

источник

2015-03-09 Jeff

функция Если не заклепки обновления быть внутри функции интервала? – Mouser

Вы имеете в виду 'rivets.bind'? это не действительно функция обновления, она просто привязывает модель к данным. но я попытался поместить его внутри setInterval без везения. – Jeff

Как бы заклепки не знали, что обратный отсчет уменьшается? – Mouser

Вы должны связать Заклепки с объектом, в противном случае привязка теряется при изменении переменной:

function startTimer(minutes) { 
    var countdownObj = {}; 
    var countdown = (60 * minutes)-1; 
    countdownObj.cd = countdown; 
    rivets.bind($('#timer'), { countdown: countdownObj }); 

    var timer = setInterval(function() { 
     countdownObj.cd--; 
     if (countdownObj.cd < 0) { 
      clearInterval(timer); 
     } 
    }, 1000); 
}

А в вашем HTML:

<div id="timer">{countdown.cd}</div>

Проверить this plunker

источник

2015-03-09 19:32:44 eladcon

безупречное спасибо! Заклепки также работают с массивами javascript, поэтому я подумал, что это будет работать на ints. – Jeff

DOM не обновляется при обновлении модели

ответ

Смежные вопросы