Мне нужна помощь в связывании объекта Date в шаблоне JsViews

Question

Я пишу небольшую игру на javascript... чтобы установить время в игре, у меня есть переменная, которая содержит текущую дату и время в игре, я хочу отображать эту дату и каждые секунды, увеличивать эту дату с часами.

Я использую JSViews для привязки данных, и она хорошо работает в приложении, за исключением этой даты, и я не понимаю!! Я создал JSFiddle, который представляет идею:

http://jsfiddle.net/ClaudeVernier/w8cwkarr/5/

try {
    var tmplDates = $.templates("#tmplDates");
    tmplDates.link("#gameSet", model);

    gameLoop();
}
catch(e) {
    alert(e);
}

У меня есть модель данных с датой и целым числом. У меня есть шаблон, который показывает модель данных с использованием конвертеров

<script id="tmplDates" type="text/x-jsrender">
    <hr /> <span data-link="{toDateString:gameDate}"></span>
    <hr /> <span data-link="{toTimeString:gameDate}"></span>
    <hr /> <span data-link="{toString:gameInt}"></span>
</script>

и каждые секунды я обновляю дату и целое число с помощью метода Observable. Целое число обновляется, но не дата!

function gameLoop() {
    var tDate = model.gameDate;
    tDate.addHours(4);

    $.observable(model).setProperty("gameDate", tDate);

    var tInt = model.gameInt + 1;
    $.observable(model).setProperty("gameInt", tInt);

    $("#lastUpdate").text( gameDateString(model.gameDate, 0) + "-" + gameDateString(model.gameDate, 6) + " - [" + model.gameInt + "]");

    window.setTimeout(gameLoop, 1000);
}

Я добавил строку, где я записываю значение без привязки данных, чтобы показать, что значения обновляются..

Answer 1

Проблема здесь в том, что вы передаете один и тот же объект даты каждый раз.

var tDate = model.gameDate;
tDate.addHours(4);
...
$.observable(model).setProperty("gameDate", tDate);

JsViews setProperty() Вызывает "событие изменения", когда вы устанавливаете другое значение по сравнению с текущим на этом пути. (т.е. если вы измените значение gameDate для модели). Здесь значением является тот же объект даты, который уже есть в вашей модели, поэтому не будет никакого события изменения и обновленного значения.

Итак, одно из решений - сделать tDate каждый раз новый объект:

var tDate = new Date(model.gameDate);
tDate.addHours(4);
...
$.observable(model).setProperty("gameDate", tDate);

Другое исправление - сделать GameDate на модели строкой - Date.valueOf().

Я создал обновление из вашего jsfiddle здесь:

http://jsfiddle.net/w8cwkarr/6/