Knockout JS inicializando una matriz observable de datos del servidor usando un tipo de Javascript

Question

Estoy buscando la mejor manera de inicializar una matriz observable de algunos datos del servidor (ViewBag), y quiero que los contenidos de la matriz sean de un tipo javascript I ha definido. Sin el requisito del tipo JS tan sólo pudiera utilizar:

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

pero también tengo un tipo de material JS que quiero usar para que pueda tener algunas propiedades específicas ViewModel extra y funciones, es decir:

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); 
     } 
} 

y entonces la inicialización necesaria se convierte en:

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

Actualmente construyo una cadena partir de los datos ViewBag y después de un procesamiento que como el inicializador de la siguiente manera:

@{ 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)]) 

pero me pregunto si hay una manera más limpia que el bit string.Join. Podría envolverlo en un Ayudante. ¿Qué haces?

Answer 1

Normalmente serializaría la matriz primero, luego la correlacionaría al ponerla en el modelo de vista. Sería como:

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); 
    })) 
} 

Requiere una cantidad menor de un procesamiento adicional en el lado del cliente, pero parece más limpio que la construcción de cadenas.