我怎樣才能在下划線/骨干.each迭代之間等待/暫停？

Question

在我的Backbone視圖中，我想迭代一個集合，並為每個項目渲染一個新的子視圖，但兩者之間有一個小的延遲（大約200ms）。 在這個例子中，Flock是一個名為Sheep :)的Backbone模型集合

render: function () {
  Flock.each(this.renderSheep)
},

renderSheep: function (mySheepModel) {
   var sheep = new SheepView({model:mySheepModel})
   $(sheep.render().el).appendTo('#field').fadeIn();
}

我該怎么做？

Answer 1

這應該工作：

render: function () {
    var i = 0,
        _self = this;

    (function renderSheepWithDelay(delay) {
        if (i <= Flock.length) {
        _self.renderSheep(Flock.at(i));
            i += 1;
        setTimeout(renderSheepWithDelay, delay);
        }
    })(200);
},

基本上，你使用遞歸函數在傳入給定的延遲后調用自身。函數迭代集合中的模型，並在集合耗盡時停止遞歸調用。

Answer 2

將它包裝在setTimeout函數中，就像這樣

renderSheep: function (mySheepModel) {
   setTimeout(function () {
   var sheep = new SheepView({model:mySheepModel})
   $(sheep.render().el).appendTo('#field').fadeIn();
 }, 3000);
}

這將調用3s超時。