8

我正在为游戏创建一个简单的倒数计时器。我正在使用 CoffeeScript 和 Meteor。我有一个带有 {{time}} 表达式的把手“计时器”模板。

这是代码：

clock = 10

timeLeft = () ->
    if clock > 0
        clock--
    else
        "That's All Folks"
        Meteor.clearInterval(interval)

interval = Meteor.setInterval(timeLeft, 1000)

if Meteor.isClient
    Template.timer.time = interval

上面的代码只是给了我一个 8 或 6 的静态显示，而不是倒数计时器。

如果我添加一些 console.log 语句，我可以看到它在终端中按设计工作。

clock = 10

timeLeft = () ->
    if clock > 0
        clock--
        console.log clock
    else
        console.log "That's All Folks"
        Meteor.clearInterval(interval)

interval = Meteor.setInterval(timeLeft, 1000)

if Meteor.isClient
    Template.timer.time = interval
4

1 回答 1

12

如果要更新车把中的值，则需要使用Session它以使其具有反应性，否则模板系统将不知道何时在 ui 中更新它。您还向模板传递了一个处理程序，它是句柄而不是计时器值。

使用下面的内容，我曾经Session将这些数据传递给车把。

clock = 10
timeLeft = ->
  if clock > 0
    clock--
    Session.set "time", clock
    console.log clock
  else
    console.log "That's All Folks"
    Meteor.clearInterval interval

interval = Meteor.setInterval(timeLeft, 1000)
if Meteor.isClient
  Template.timer.time = ->
    Session.get "time"

同样在javascript中，以防其他人想要这个：

var clock = 10;

var timeLeft = function() {
  if (clock > 0) {
    clock--;
    Session.set("time", clock);
    return console.log(clock);
  } else {
    console.log("That's All Folks");
    return Meteor.clearInterval(interval);
  }
};

var interval = Meteor.setInterval(timeLeft, 1000);

if (Meteor.isClient) {
  Template.registerHelper("time", function() {
    return Session.get("time");
  });
}

本质上你告诉Session时间值，当它更新时它告诉模板系统用更新的时间值重绘。

于 2013-03-05T16:39:47.863 回答