0

Ich benutze ko.mapping-Dienstprogramm, um mein mvc-Modell an knockoutjs zu binden. Mein MVC-Modell ist dasKnockout-Mapping von MVC

public class Person 
    { 
    public string Name { get; set; } 
    public string Surname { get; set; } 
    public Achievement[] achievements { get; set; } 
    } 

    public class Achievement 
    { 
    public string Title { get; set; } 
    public int Score { get; set; } 
    } 


    public ActionResult Index() 
    { 
    Person person = new Person 
    { 
     Name = "Name", 
     Surname = "Surname", 

     achievements = new Achievement[] 
     { 
      new Achievement { Title="Ach 1", Score=10 }, 
      new Achievement { Title="Ach 2", Score=11 }, 
      new Achievement { Title="Ach 3", Score=12 }, 
     } 
    }; 
    return View(person); 
    } 

ich mein Javascript-Modell möchte einige zusätzliche Eigenschaften enthalten sowohl in Person und Achievement-Objekte so verwende ich Knockout-Mapping-Plugin und schreiben nur die neuen Eigenschaften in JavaScript (Person.fullName und Leistung. Botschaft).

@{ 
    string theData = new JavaScriptSerializer().Serialize(Model); 
} 
    <div> 
    <div><label>Name </label> <span data-bind="text:Name"></span></div> 
    <div> <label>Surname </label> <span data-bind="text:Surname"></span> </div> 
    <div> <label>Full Name </label> <span data-bind="text:fullName"></span></div> 

    <ul data-bind="foreach:achievements"> 
     <li> 
      <span data-bind="value:Title" /> 
      <span data-bind="text:Score"></span> 
      <span data-bind="text:Message"></span> 
     </li> 
    </ul> 
</div> 
<script type="text/javascript"> 
    personViewModel = function (data) { 
     var self = this; 
     ko.mapping.fromJS(data, {}, self); 
     self.fullName = ko.computed(function() { 
      return self.Name() + " " + self.Surname(); 
     }); 
    } 

    achievement = function (data) { 
     var self = this; 
     ko.mapping.fromJS(data, {}, self); 

     self.Message = ko.computed(function() { 
      return self.Title() + " " + self.Score(); 
     }); 
    } 
    ko.applyBindings(new personViewModel(@Html.Raw(theData))); 
</script> 

Das Problem ist, dass die Leistungsklasse überhaupt nicht zugeordnet ist. Was ist der richtige Weg, Daten von MVC-Controller zu laden, ohne das Modell in C# und in Javascript zweimal zu schreiben.

Antwort

0

Sie können so etwas wie dies versuchen:

var custMap = {}; 

custMap['achievements'] = { 
create: function(data) { 
    var result = []; 
    for(var i = 0; i < data.length; i++){ 
    result.push(new achievement(data[i]); 
    } 
    return new ko.observableArray(result); 
} 
} 

Und es zur Karte:

ko.mapping.fromJS(data, custMap, self); 
+0

ich Ihren Code versucht, und ich erhalte diesen Fehler. 'Titel ist nicht definiert'. – albert

+0

@albert Versuchen Sie, self.Message auskommentieren und sehen, ob es funktioniert? Um die Dinge einfacher zu machen, können Sie den Code in der Chrome-Konsole debuggen, break point it –

+2

Die create-Funktion erhält nicht das gesamte Array, sondern seine einzelnen Elemente. Verwenden Sie 'create: function (Optionen) {return new achievement (options.data)}' (Beispiel: https://jsfiddle.net/8ma2Lg12/) – user3297291