Javascript 主干和遍历集合，但结果未附加到$（this.el）

我正在将一个标准的web应用程序迁移到主干网，今天是第一天，所以假设我犯了一些真正的初学者错误。我有下面的视图类，它接受一个集合。我对它进行迭代，它返回它基于console.log（注释为“this works ok”）的内容，但它没有附加任何内容（注释为“this DoesnWork”）。有人能从这个片段看出我做错了什么吗

var HomepagePositionsView = Backbone.View.extend({
    render:function(){
       var str="";
       this.collection.forEach(function(location){
         var hpsView=new HomepagePositionView({model:location});
         //hpView.render();
         console.log(hpsView.render().el); // this works ok
         //str+=hpView.el;
         $(this.el).append(hpsView.render().el);  // this doesn't work

       });
       //$(this.el).text(str);
       console.log(this.el); // just <div></div>
       return this;
    }
  });

---

您能否显示您正在初始化新视图的位置，即：

new HomepagePositionsView({...})

我的猜测是，您没有提供要附加到的el，因此发生的情况是，您在视图中正确地创建了html，但没有指定要附加到的DOM元素。为了清楚起见，它应该是这样的：

new HomepagePositionsView({collection: myCollection, el: $('#someElToAttachTo')})

您应该使用这个.el而不是$（this.el），因为这个.el是一个缓存的jQuery对象。此外，如果您的主干库是最新的，您可以这样做

this.collection.each(function(){...})

---

它将委托给下划线.js，而下划线.js又将委托给最快的选项，具体取决于浏览器。最后，我会考虑看看Marionette.js，如果你要做任何认真的工作与骨干，因为它提供了许多很好的特点，以建立大型的JS应用程序。

< P>当您正在迭代通过您的集合，<强>此< /强>不再是指你的视图对象，你用来引用你的EL。尝试将其缓存在循环外部，将其指定给self，然后在从渲染子视图追加el时从self引用el

var self = this;

this.collection.forEach(function () {
    $(self.el).append(...)
});

---

thx，我添加了我的实例化代码，让我看看你在回答中说了什么。我知道使用hpView是非常糟糕的做法。事实上，现在让我改变一下。提线木偶，让我先把这些基本知识记下来：-）一切看起来都很好。检查$（'#app'）.html（hpView.el）；问题在于$（'#app'）没有抓取元素，或者hpView.el没有生成任何html。另外，一种简洁的呈现方式是新的HomepagePositionsView（{collection:data，el:$（'#app'）））。render（）；隐马尔可夫模型。。。所以我认为是后一个hpView.el没有产生正确的输出，但这正是我想弄明白的。thxAh，这可能是因为forEach上下文中的“this”不是视图。要么声明var self=this；在forEach外面，然后做self.$el。。。或者使用this.collection.each（function（）{…}，this），然后“this”将是正确的contextgreat，就是这样。forEach是否启动了一个新的作用域？是否因为它是一个函数并创建了一个新的对该的引用？有点困惑。

var self = this;

this.collection.forEach(function () {
    $(self.el).append(...)
});