ノックアウトJSは、JavaScriptデータ型からサーバデータから観測可能な配列を初期化する

Question

ノックアウト観測型配列をいくつかのサーバデータ（ViewBag）から初期化する最良の方法を探しており、配列の内容をjavascriptタイプI定義した。私はいくつかの余分なViewModelに固有の性質を持つことができ、機能は、IE

materialVarieties: ko.observableArray(@Html.Raw(Json.Encode(ViewBag.Materials))) 

が、私はまた、私はを使用したい材料のJSタイプがあります：

var material = function(id, name) { 
    this.id = id; 
    this.name = name; 
    this.selected = ko.observable(false); 

    this.select = function() 
    { 
     jQuery.each(processViewModel.materials(), function(index, item) 
     { 
      item.selected(false); 
     }); 
     this.selected(true); 
     } 
} 

JSタイプの要件がなければ、私はちょうど使用することができます

し、必要な初期設定は次のようになります。

materialVarieties: ko.observableArray([new material(1, "Apricot"), ..... 

は現在、私はViewBagデータから文字列を構築し、このような初期化子としてそれをレンダリング：

@{ var items = string.Join(",", 
       ((IEnumerable<MaterialVariety>) ViewBag.Materials) 
          .Select(m => string.Format("new material({0}, {1})", 
             Json.Encode(m.Id), Json.Encode(m.Name)))); } 

var processViewModel = { 
    material: ko.observableArray([@Html.Raw(items)]) 

しかし、string.Joinビットよりもきれいな方法があるのだろうかと思っています。私はそれをヘルパーで包み込むことができました。職業はなんですか？

Answer 1

私は通常、配列をシリアル化してから、ビューモデルに配置するときにマップします。次のようになります。

var originalVarieties = @Html.Raw(Json.Encode(ViewBag.Materials)) 

var processViewModel = { 
    materialVarieties: ko.observableArray(ko.utils.arrayMap(originalVarieties, function(variety) { 
     return new material(variety.id, variety.name); 
    })) 
} 

クライアント側では少量の追加処理が必要ですが、文字列を作成するよりもきれいです。