ko.mapping प्लगइन

Question

के साथ जेनरेट किए गए एक अवलोकन में अवलोकन योग्य एक नॉकआउट डालने वाला मैकिंग प्लगइन के साथ जेनरेट की गई एक सरणी में मैन्युअल रूप से गणना की गई है? यहां एक उदाहरण दिया गया है जो मैपिंग प्लगइन का उपयोग नहीं करता है, लेकिन मैं जानना चाहता हूं कि यह इसका उपयोग कर सकता है या नहीं।

कहते हैं कि मैं सर्वर से JSON डेटा है की सुविधा देता है:

[{ 
    "OrderID":1, 
    "FirstName":"Bill", 
    "LastName":"Smith", 
},{ 
    "OrderID":2, 
    "FirstName":"Jeff", 
    "LastName":"Evans", 
} 
{ 
    "OrderID":3, 
    "FirstName":"Dan", 
    "LastName":"Johnson", 
}] 

मेरे विचार को मैं एक आदेश वर्ग और एक दृश्य मॉडल है:

function Order(order) { 
    var self = this; 
    self.OrderID = ko.observable(order.OrderID); 
    self.FirstName = ko.observable(order.FirstName); 
    self.LastName = ko.observable(order.LastName); 

    /*This is what I want to insert after the mapping plugin 
    generates "orders on the ViewModel*/ 
    self.FullName = ko.computed(function() { 
     return self.FirstName() + ' ' + self.LastName(); 
    }); 

} 

function ViewModel() { 
    var self = this; 
    self.orders = ko.observableArray([]) 

//Get orders 
    $.ajax({ 
    url: '@Url.Action("orders")', 
    type: "post", 
    success: function (data) { 
     var mappedOrders = $.map(data, function (item) { return new Order(item) }); 
     self.orders(mappedOrders); 
    } 
    })  
} 

क्या यह संभव है करने के लिए मानचित्रण प्लगइन का उपयोग करने के लिए दृश्य मॉडल पर ऑर्डर सरणी उत्पन्न करें, और ऑर्डर सरणी में गणना किए गए अवलोकन योग्य "पूर्ण नाम" को भी सम्मिलित करने में सक्षम हो?

Answer 1

आप कर सकते हैं, documentation के अनुसार:

var mapping = { 
    'children': { 
     create: function(options) { 
      return new myChildModel(options.data); 
     } 
    } 
} 

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

    this.nameLength = ko.computed(function() { 
     return this.name().length; 
    }, this); 
} 

var viewModel = ko.mapping.fromJS(data, mapping); 

Answer 2

प्रलेखन विचार करने के बाद, मैं सफलतापूर्वक यह मेरे उदाहरण के रूप में this jsFiddle में और निम्नलिखित लाइनों में प्रदर्शन लागू:

var data = [{ 
    OrderID: '1', 
    FirstName: 'Bob', 
    LastName: 'Stevens' 
}, { 
    OrderID: '2', 
    FirstName: 'Jim', 
    LastName: 'Johnson' 

}]; 

function order(data) { 
    var self = this; 
    var model = ko.mapping.fromJS(data, {}, self); 
    model.FullName = ko.computed(function() { 
     return self.FirstName() + ' ' + self.LastName(); 
    }); 
    return model; 
} 

var mapping = { 
    create: function (options) { 
     return new order(options.data); 
    } 
}; 

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

var vm = new viewModel(); 

ko.applyBindings(vm);