0

ビューを 10 秒ごとに更新するにはどうすればよいですか? または、jsonファイルで何かが変更された場合にのみ、このビューを再レンダリングまたは再フェッチする方法はありますか?

私のメイン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からの新しいデータが必要です...

コンソールで 10 秒ごとにエラーが発生するようになりました。

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

2 に答える 2

0

正しい方法は

    loop:function(){
         var that = this;
         clearInterval(some.globally.defined.interval);
         some.globally.defined.interval = setInterval(function(){
             that.render()
         },interval);
    }
于 2014-09-07T10:34:06.530 に答える
0

function loop10秒ごとにレンダリングを呼び出すものを追加しました

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-27T09:10:49.970 に答える