0

私はbackbone.jsアプリで問題に直面しています：JSON Webサービスからデータをフェッチしようとしていますが、GET HTTPリクエストは成功します（Chromeの開発者コンソールを調べました）が、バックボーンフェッチはエラーをトリガーし、モデルを更新しません。

ここでコードを見ることができます： https ：//github.com/tdurand/faq-app-client-mobile

そして、アプリを実行して、ここでデバッグを試みることができます：http: //tdurand.github.com/faq-app-client-mobile/

JSONフィードは次のようになります

[
    {
       "title":"Probleme ou Bug",
       "desc":"Pour les problemes ou les bugs rencontrés",
       "entries":[
           {
             "title":"testdqs",
             "desc":"testqsdqs"
           }
        ]
    }
]

私のコレクションモデルは次のとおりです。

var Categories = Backbone.Collection.extend({

url:"http://cryptic-eyrie-7716.herokuapp.com/faq/fr",

model:Category,

parse:function(response) {
    console.log("test")
    console.log(response);
    return response;
},

sync: function(method, model, options) {
    var params = _.extend({
        type: 'GET',
        dataType: 'jsonp',
        url: model.url,
        processData:false
    }, options);

    return $.ajax(params);
},

}）;

そして私の見解：

var IndexView = Backbone.View.extend({

el: '#index',

initialize:function() {
    Categories.fetch({
        success: function(m,r){
          console.log("success");
          console.log(r); // => 2 (collection have been populated)
        },
        error: function(m,r) {
          console.log("error");
          console.log(r.responseText);
        }
    });
    Categories.on( 'all', this.render, this );
},

//render the content into div of view
render: function(){
  //this.el is the root element of Backbone.View. By default, it is a div.
  //$el is cached jQuery object for the view's element.
  //append the compiled template into view div container
  this.$el.html(_.template(indexViewTemplate,{categories:Categories}));
  //Trigger jquerymobile rendering
  $("#index").trigger('pagecreate');

  //return to enable chained calls
  return this;
}
});
return IndexView;

あなたの助けをどうもありがとう

4

2 に答える 2

0

From what I see, you're not making an instance of your collection anywhere. Javascript isn't really object oriented and it has this weird functions-as-classes and prototype -inheritance type of deal that can confuse anyone coming from the OO -world.

var Categories = Backbone.Collection.extend...

What happens above is that you extend the Backbone Collection's (which is a function) prototype properties with the object (or dictionary) you define. To be able to instantiate this 'class' to an object, you need to use the new keyword. You don't do this, so you are calling the function fetch of the 'class' Categories, which will produce unexpected results.

So instantiate your collection before fetching:

initialize:function() {
    this.collection = new Categories(); // instantiate the collection

    // also set event handlers before producing events
    this.collection.on( 'all', this.render, this );

    this.collection.fetch({
        success: function(m,r){
          console.log("success");
          console.log(r); // => 2 (collection have been populated)
        },
        error: function(m,r) {
          console.log("error");
          console.log(r.responseText);
        }
    });
}

Hope this helps!

于 2012-09-24T10:52:22.790 に答える
0

I found my mistake.

My backend server (with play! framework), was not rendering JSONP properly

This is the code i now use to do it if someone has the same issue.

    //Render JSONP
    if (request.params._contains("callback")) {

        Gson gson = new Gson();

        String out = gson.toJson(categoryJSON(categories,lang));

        renderText(request.params.get("callback") + "(" + out + ")");

     } else {

        renderJSON(categoryJSON(categories,lang));

     }
于 2012-09-26T18:26:36.543 に答える