モデルのJavaScript配列プロパティに基づいて、Backboneマニオネットコレクションビューを正しく表示するにはどうすればよいですか？

Question

* 更新：下記の最後のコードブロックの最終回答コードを参照してください。 *

現在、コレクションビューにコレクションを表示する際に問題が発生しています。コレクションそこで本質的にアプリケーションバージョンのJavaScript配列であるApplicationCategoriesというプロパティを有する

ApplicationVersion { Id: 1, VersionName: "", ApplicationCategories[] } 

ように（擬似コード）のような既存のモデルの特性です。現在、ApplicationCategoriesに関連付けられたコレクションビューをレンダリングすると、何もレンダリングされません。私がChromeのjavascriptデバッガでデバッグすると、カテゴリがまだ設定されていないように見えます（つまり、ApplicationVersionがまだフェッチされていないと仮定します）。それは現在

ApplicationCategoryモデル、コレクション、およびビュー

ApplicationModule.ApplicationCategory = Backbone.Model.extend({ 
    urlRoot:"/applicationcategories" 
}); 

ApplicationModule.ApplicationCategories = Recruit.Collection.extend({ 
    url:"/applicationcategories", 
    model:ApplicationModule.ApplicationCategory, 

    initialize: function(){ 
     /* 
     * By default backbone does not bind the collection change event to the comparator 
     * for performance reasons. I am choosing to not preoptimize though and do the 
     * binding. This may need to change later if performance becomes an issue. 
     * See https://github.com/documentcloud/backbone/issues/689 
     * 
     * Note also this is only nescessary for the default sort. By using the 
     * SortableCollectionMixin in other sorting methods, we do the binding 
     * there as well. 
     */ 
     this.on("change", this.sort); 
    }, 

    comparator: function(applicationCategory) { 
     return applicationCategory.get("order"); 
    }, 

    byName: function() { 
     return this.sortedBy(function(applicationCategory) { 
      return applicationCategory.get("name"); 
     }); 
    } 
}); 

_.extend(ApplicationModule.ApplicationCategories.prototype, SortableCollectionMixin); 

ApplicationModule.ApplicationCategoryView = Recruit.ItemView.extend({ 
    template:"application/applicationcategory-view-template" 
}); 

ApplicationModule.ApplicationCategoriesView = Recruit.CollectionView.extend({ 
    itemView:ApplicationModule.ApplicationCategoryView 
}); 

ApplicationCategoryテンプレートここ

<section id="<%=name%>"> 
    <%=order%> 
</section> 

アプリケーションバージョンモデル、コレクション、およびビュー

ApplicationModule.ApplicationVersion = Backbone.Model.extend({ 
    urlRoot:"/applicationversions" 
}); 

ApplicationModule.ApplicationVersions = Recruit.Collection.extend({ 
    url:"/applicationversions", 
    model:ApplicationModule.ApplicationVersion 
}); 

ApplicationModule.ApplicationVersionLayout = Recruit.Layout.extend({ 
    template:"application/applicationversion-view-template", 

    regions: { 
     applicationVersionHeader: "#applicationVersionHeader", 
     applicationVersionCategories: "#applicationVersionCategories", 
     applicationVersionFooter: "#applicationVersionFooter" 
    } 
}); 

ApplicationModule.ApplicationVersionController = { 
    showApplicationVersion: function (applicationVersionId) { 
     ApplicationModule.applicationVersion = new ApplicationModule.ApplicationVersion({id : applicationVersionId}); 

     var applicationVersionLayout = new Recruit.ApplicationModule.ApplicationVersionLayout({ 
      model:ApplicationModule.applicationVersion 
     }); 

     ApplicationModule.applicationVersion.fetch({success: function(){ 
      var applicationVersionCategories = new Recruit.ApplicationModule.ApplicationCategoriesView({ 
       collection: ApplicationModule.applicationVersion.application_categories 
      }); 
      applicationVersionLayout.applicationVersionCategories.show(applicationVersionCategories); 
     }}); 

     // Fake server responds to the request 
     ApplicationModule.server.respond(); 

     Recruit.layout.main.show(applicationVersionLayout); 
    } 
}; 

をスタンドとしてここに私のコードです私のApplicationVersionテンプレート

<section id="applicationVersionOuterSection"> 
<header id="applicationVersionHeader"> 
    Your Application Header <%= id %> 
</header> 
<section id="applicationVersionCategories"> 
</section> 
<footer id="applicationVersionFooter"> 
    Your footer 
</footer> 

私は現在、私のサーバの応答を模擬するためにSinonを使用していますが、私は、私はを通して見て期待どおり、それは情報に応答しているとして、これは問題を引き起こしているとは思わないもう一つ注意すべきjavascriptデバッガ（と私はそれが正しくApplicationVersion IDを表示していると言ったように）。私はこのコードを提供することもできます。

現在、アプリケーションのバージョンID（テンプレート内のID）が表示されていますので、通常のプロパティで正しくデータを取得していることがわかります。アプリケーションクラスのjavascript配列プロパティ。

最終的に私はApplicationVersionのフェッチの成功にバインドしてから、ApplicationCategoriesのビューを設定します。このコレクションビューを作成するより良い方法があるのだろうと私は思っているように、これは機能していないので、作業のコード例デレク・ベイリーがあまりにも私を導くこと：任意の助け

UPDATEため

感謝。

ApplicationModule.ApplicationVersionController = { 
    showApplicationVersion: function (applicationVersionId) { 
     ApplicationModule.applicationVersion = new ApplicationModule.ApplicationVersion({id : applicationVersionId}); 

     var applicationVersionLayout = new Recruit.ApplicationModule.ApplicationVersionLayout({ 
      model:ApplicationModule.applicationVersion 
     }); 

     ApplicationModule.applicationVersion.fetch(); 

     // Fake server responds to the request 
     ApplicationModule.server.respond(); 

     Recruit.layout.main.show(applicationVersionLayout); 

     var applicationVersionCategories = new Recruit.ApplicationModule.ApplicationCategoriesView({ 
      collection: new Backbone.Collection(ApplicationModule.applicationVersion.get('application_categories')) 
     }); 
     applicationVersionLayout.applicationVersionCategories.show(applicationVersionCategories); 
    } 
}; 

Answer 1

マリオネットのCollectionViewが有効でBackbone.Collection、ない単純な配列が必要です。ビューに渡すときに、配列からBackbone.Collectionを作成する必要があります。

new MyView({ 
    collection: new Backbone.Collection(MyModel.Something.ArrayOfThings) 
});