骨干设置间隔（以10秒为间隔更新所有模型...）

请如何每10秒更新一次视图？或者只有在我的json文件中发生了某些变化时，才有办法重新渲染或重新获取此视图？骨干设置间隔（以10秒为间隔更新所有模型...）

我的主要JS：

var AppRouter = Backbone.Router.extend({ 

routes: { 
    "" : "categories", 

}, 

initialize: function() { 
    this.headerView = new HeaderView(); 
    $('.header').html(this.headerView.el); 
},  

categories: function() { 
    if (!this.CategoriesView) { 
     this.CategoriesView = new CategoriesView(); 
    } 
    $('#content').html(this.CategoriesView.el); 
    this.headerView.selectMenuItem('categories-menu'); 
}, 




utils.loadTemplate(['HeaderView'], function() { 
app = new AppRouter(); 
Backbone.history.start(); 

});

我的收藏：

var Categories = Backbone.Collection.extend({ 
url: 'api/categories_and_products.json' 
});

JSON：

[ 
    { 
     "title": "Pizza", 
     "id": 1, 
     "products": [{ "name" : "Romana"},{"name" : "Viennese"},{"name" : "Capricciosa"},{"name" : "Quattro formaggi"},{"name" : "Bianca"},{"name" : "Alla casalinga"}] 
    }, 
    { 
     "title": "Pasta", 
     "id": 2, 
     "products": [{ "name" : "Spagetti Napolitana"},{"name" : "Penne Arrabiata"},{"name" : "Tagliatelle with cream sauce"},{"name" : "Tortellini"}] 
    } 
]

我对类别HTML模板：

<script type="text/template" id="categories-template">   
    <% _.each(categories, function(category) { %> 
     <li class="categorycls"><%= category.get('title') %></li> 

     <% _.each(category.get("products"), function(product) { %> 

      <li class="productscls"> 
      <%= product.name %>      

      </li> 

     <% }); %> 
    <% }); %>     
</script>

这是鉴于我想一直更新：

var CategoriesView = Backbone.View.extend({ 

initialize:function() { 
    this.render(this); 
    this.loop(); 
}, 
loop:function(){ 
    setInterval(function() { this.render() }, 1000) 
}, 
render:function (that) { 

    var categories = new Categories();   
    categories.fetch({ 
     success: function (categories) {    
     var template = _.template($('#categories-template').html(), {categories: categories.models});   
      that.$el.html(template); 
     } 
    }) 
}    
});

我不知道如何重新呈现或重取...我需要新的数据从JSON无刷新网站manualy更新中...

现在，在控制台每10秒为错误：

Uncaught TypeError: Object [object global] has no method 'render'

来源

2013-08-27 Makromat

我已经添加了一个function loop这将调用render每10秒

var CategoriesView = Backbone.View.extend({ 

    initialize:function() { 

     this.render(this); 
     this.loop(); 

    }, 
    loop:function(){ 

     //setInterval(render,10*1000); 

     //[Edit] 
     setInterval(this.render(this),10*1000); 
    }, 

    //render:function() { 
    //var that = this; 

    //[Edit] 

    render:function (that) { 

     var categories = new Categories();   
     categories.fetch({ 
      success: function (categories) {    
      var template = _.template($('#categories-template').html(), {categories:  categories.models});   
       that.$el.html(template); 
      } 
     }) 

    }    
});

来源

2013-08-27 09:10:49 amorbytes

感谢的答案，但你的代码无法正常工作我... 未捕获ReferenceError：未定义渲染 – Makromat

@MatejMarko我明白了你的观点。我已经编写了'setInterval（rander'）错误是由于它现在我已经更新代码到'setInterval（this.rander'。 – amorbytes

谢谢我修复了你的代码，但现在我有Uncaught TypeError：无法调用方法'html'未定义 – Makromat

我相信在正确的方法是

loop:function(){ 
     var that = this; 
     clearInterval(some.globally.defined.interval); 
     some.globally.defined.interval = setInterval(function(){ 
      that.render() 
     },interval); 
    }

来源

2014-09-07 10:34:06 man

骨干设置间隔（以10秒为间隔更新所有模型...）

回答

相关问题