バックボーン：ページロード中にレンダリングされたビューを再利用する方法

Question

お気に入りのWebページURLをブックマークしてフォルダで管理できるURLマネージャを作成しています。

1. アプリの読み込み中に、ユーザーが作成したフォルダのリストを表示するビューをレンダリングします。このビューはページの読み込み時には表示されません。
2. は、ユーザーが
3. そこから、ユーザーは私がしたい
5. ユーザーがURLビューで「フォルダへ移動」アイコンをクリックすると、フォルダ内のURLを手配することができURLのリストを見るために彼のホームページに移動します'Move to Folder'アイコンの下に絶対位置にあるfolderSelectorViewを表示します。どうやってやるの？
6. また、URLがすでにフォルダに移動さ​​れている場合は、URLが移動されたフォルダ内のfolderSelectorViewにチェックマークが表示されます。

ここではどのように進める必要がありますか？

ここでは、フォルダのリストをロードする方法を示します。

var folderColl = new FolderColl(); 
new FolderSelectorView({collection: folderColl}); 

ここにURLビューのコードを示します。

URLView = Backbone.View.extend({ 
    tagName: 'li', 
    template: _.template($('#URLTempalte').html()), 
    events: { 
     'click .FolderChange': 'showFolderSelector' 
    }, 

    initialize: function() { 
     _.bindAll(this, 'render'); 
    }, 

    render: function() { 
     return $(this.el).html(this.template(this.model.toJSON())); 
    }, 

    showFolderSelector: function() { 
     // How should I display the view here 
     // view should display below the "Move to folder" icon 
     // Doing something like `new FolderSelectorView` is not what I'm after 
     // since that will just re-render the view for every URL displayed 
    } 
}); 

Answer 1

既存のHTML要素にバックボーンビューを簡単に添付できます。ビューのためにelをインスタンス化するときにビューに渡すだけです。 elには、jQueryセレクタで見つかった既存のhtml要素を含め、任意のものを指定できます。

var myEl = $("#someElementOnThePage"); 
var myView = new MyView({ 
    el: myEl 
}); 

これは#someElementOnThePage要素にあなたのビューを添付します、あなたはそれを自分でレンダリングされたかのように、あなたはそれを使用することができます。

さらに詳しくは、ブログの投稿を参照してください。http://lostechies.com/derickbailey/2011/09/26/seo-and-accessibility-with-html5-pushstate-part-2-progressive-enhancement-with-backbone-js/