0

バックボーン リレーショナル モデルを使用してバックボーン アプリを構築しています (ただし、この質問には関係ありません)。

基本的に、非表示の div を表示する編集ボタンがあります。非表示の div id 内には、DetailsViewテーブル要素をレンダリングしてユーザーのリストを作成するサブビュー ( と呼ばれる) があります。私のモデル（アプリ全体）はおおよそ次のようになります。

{ 'id': 'foo',
  'users': 
   {
   'username': 'bobby',
   'password': 'peanuts'
   },
   {
   'username': 'sally',
   'password': 'watermellon'
   }
}

私のメイン ビュー (上記のモデルのコレクションによって供給される) では、ユーザーが編集ボタンをクリックすると、これがトリガーされます。

edit: function(){
      var userModels = this.model.get('users'),
          detailViewContainer = this.$('tbody.users');
      console.log(name + ' has ' + userModels.length + ' models');
      //clear out eveything in tbody.users to prevent dupes
      detailViewContainer.html('');
      //check if there are actually user models
      if(userModels.length > 0){
        userModels.forEach(function(user) {
         var details = new DetailsView({model: user});
         details.render();
         detailViewContainer.append(details.el);
         });
}

detailViewContainerコードの臭いは、それを明示的に宣言しなければならないという事実から来ています。

もともと、私の forEach ループでは、コードを含むビューで別の関数を呼び出して、DetailsView. ただし、のコンテキストが失われますthis。

私の元のコードは次のようになりました。

   edit: function() {
      var userModels = this.model.get('users'),
          detailViewContainer = this.$('tbody.users');
      console.log(name + ' has ' + userModels.length + ' models');
      //clear out eveything in tbody.users to prevent dupes
      detailViewContainer.html('');
      //check if there are actually user models
      if(userModels.length > 0){
        userModels.forEach(function(user) {
         this.renderDetailsView;
         });
      }
    },

    renderDetailsView: function(user) {
       var details = new DetailsView({model: user});
       this.$('tbody.users').append(details.render());
     },

では、 のrenderDetailsViewコンテキストが失われ、 を適切な DOM 要素にthis追加できませんでした(コンテキストがループに入ったためにウィンドウになったためDetailsView、ビューはすべてのtbody.usersDOM 要素に追加されます)。this

a を明示的に宣言する必要があるのはハッキリしているように思えます。ウィンドウ全体ではなく、メイン ビューを指すコンテキストdetailsViewContainerを保持できるようにしたいと考えています。this

DetailsViewテンプレートは単なる<tr><td></td></tr>要素のセットです。を作成せずにこのビューを埋め込むより良い方法はありdetailViewContainerますか?

(考えられるオプションの 1 つは、all 自体DetailViewから返されたコレクションをループすることでしthis.model.get('users')た...それは良い考えですか?)

4

1 に答える 1

2

「this」が失われたために現在行っていることを行っている場合は、コンテキストを forEach に渡すことができます。

userModels.forEach(function(user) {
     this.renderDetailsView();
},this);

これで、適切な「これ」が利用可能になりました。お役に立てれば。

于 2012-07-31T20:13:32.857 に答える