0
    console.log('Loaded inedx.js-->');
console.log(jQuery);
(function($){
    console.log('In immediate block');
  //Create new tweet view
   var Tweet = Backbone.Model.extend({
      defaults: function(){
        return {
          name    : 'defaultName',
          status  : 'default status'
       }
      }
    });

   var TweetList = Backbone.Collection.extend({
      model :Tweet
   });

   var TweetView = Backbone.View.extend({
      model : new Tweet(),
      tagName : 'div',
      initialize : function(){
         this.template = _.template($('#tweet-template').html());
      },
      render : function() {
          this.$el.html(this.template(this.model.toJSON()));          
          return this;
      }
   });

  var tweets = new TweetList();    
  var TweetsView = Backbone.View.extend({
    model : tweets,
    tagName : 'div',
    el : $('#allTweetContainer'),
    initialize: function(){
      this.model.on('add',this.render,this);      
    },    
    render : function(){
      var self = this;      
      _.each(this.model.toArray(),function(tweet,i){                   
          self.$el.append((new TweetView({model:tweet})).render().$el.html());
      });
      return this;
    }

  });

    $(document).ready(function (){

       tweets.add(new Tweet({
          status : 'status1',
          author : 'author1'
       }));
       var tweet = new Tweet({
          status : 'status1-----',
          author : 'author1-------'
       });
       //console.log(new TweetView());
       //$('#allTweetContainer').append( _.template($('#tweet-template').html(),tweet.toJSON()));

       tweets.add(new Tweet({
          status : 'status2',
          author : 'author2'
       }));
       tweets.add(new Tweet({
          status : 'status3',
          author : 'author3'
       }));
       tweets.add(new Tweet({
          status : 'status4',
          author : 'author4'
       }));
        var tweetApp = new TweetsView();
       tweetApp.render();

       console.log(tweets.toJSON());    
    });   
})(jQuery); 

我无法呈现 TweetsView。而不是 :self.$el.append 当我使用 : `$('#allTweetContainer').append 它起作用了。但理想情况下,它应该与 self.$el.append 一起使用。我相信必须做一些额外的事情来获得正确的 $el ,它应该是一个指向给定 el 的 jQuery 变量。任何指针都会非常有帮助。提前致谢。

4

1 回答 1

3

您应该将 el 声明为字符串而不是 jQuery 选择器。所以你的 TweetsView 应该是这样的:

var TweetsView = Backbone.View.extend({
  model : tweets,
  tagName : 'div',
  el : '#allTweetContainer',
  initialize: function(){
    this.model.on('add',this.render,this);      
  },    
  render : function(){
    var self = this;      
    _.each(this.model.toArray(),function(tweet,i){                   
      self.$el.append((new TweetView({model:tweet})).render().$el.html());
    });
    return this;
  }
});

将 TweetView 附加到 TweetsView 时,您还可以这样做:

_.each(this.model.toArray(),function(tweet,i){                   
  self.$el.append((new TweetView({model:tweet})).render().el);
});
于 2013-09-12T15:24:58.690 回答