Question

有一种简单的方法可以在当前日期（只是当天，而不是时间）发生变化时触发Backbone.js事件吗？

Answer 1

所以，问题的答案 - 没有简单的方式而没有推出自己的解决方案。

那就是说，实施并不算太糟糕。

这里的想法是你有一个带有'day'属性的模型。在初始化模型时，我们将调用初始化程序，该初始化程序将确定直到“明天午夜”的持续时间。午夜过后，将调用setTimeout，这将更新模型的'day'属性。在视图中，我们会听取“day”属性的更改。更新属性后，我们将重新初始化更改日期的方法。这样就没有轮询，一旦日期改变，你的事件就会被触发。

当然，有很多方法可以广播更新 - 即明确触发事件而不是set属性 - 但这里是我上面描述的代码：

<强>模型

var Model = Backbone.Model.extend({
    defaults: function(){
        var d = new Date();
        return {
            day: d.getDay()
        }
    },
    initialize: function(){
        _.bindAll(this, '_init_date_trigger');
        this._init_date_trigger();
    },
    _init_date_trigger: function(){
        var now = new Date();
        var midnightTomorrow = new Date();
        midnightTomorrow.setDate(now.getDate() + 1);
        midnightTomorrow.setHours(0,0,0,0);
        var msTillTomorrow = midnightTomorrow - now + 1;
        var me = this;
        console.log("date will be changed in " + msTillTomorrow);
        setTimeout(function(){
            me.set("day", new Date().getDay());
            me._init_date_trigger();
        }, msTillTomorrow);
    }
})

查看

var View = Backbone.View.extend({ template:_.template("The day is: <span class='day'> <%= day %> </span>"), initialize: function(){ this.model.on("change:day", this.render); }, render: function(){ this.$el.html( this.template( this.model.toJSON() ) ); return this; } });

<强>实施

var myModel = new Model(); var myView = new View({model: myModel}); $("#example").html( myView.render().el );

这是小提琴：http://jsfiddle.net/6KGzt/4/

Answer 2

我没有比定期检查更好的主意：

var lastCheckedDate = new Date();
setInterval(function () {
    var d = new Date();
    //TODO: check whether the day in d and lastCheckedDate are the same or not
    //TODO: if not, trigger event
    lastCheckedDate = d;
}, 10000); //this will check in every 10 seconds

Answer 3

您可以创建扩展Backbone Events的构造函数，如下所示：

var Clocks = function(){};

_.extend(Clocks.prototype, Backbone.Events, {

  start: function () {
    this.timer = setInterval(_.bind(this.tick, this), 1000);
    return this;
  },

  tick: function () {
    this.trigger('tick', new Date)
  },

  stop: function () {
    this.timer && clearInterval(this.timer);
    return this;
  }

});

然后在骨干模型中使用它来更新它的属性：

var ClocksModel = Backbone.Model.extend({

  defaults: function () {
    var date = new Date
    return {
      date: date.getDate(),
      seconds: date.getSeconds()
    }
  },

  initialize: function () {
    this.clocks = new Clocks;
    this.clocks.on('tick', this.updateDate, this)
  },

  updateDate: function (date) {
    this.set('date', date.getDate())
    this.set('seconds', date.getSeconds())
  },

  start: function () {
    this.clocks.start();
    return this;
  },

  stop: function () {
    this.clock.stop();
    return this;
  }

});

然后你就可以：

clocks = new ClocksModel;
clocks
  .on('change:seconds', function(model, newSeconds) {
    console.log('seconds changed to ', newSeconds)
  })
  .on('change:date', function(model, newDate) {
    console.log('date changed to', newDate)
  })
  .start()

当前日期更改时触发Backbone.js事件

3 个答案: