6
मुझे यकीन है कि यह किसी के लिए एक आसान जवाब होगा।अवलोकन योग्य से हटाएंअरे- knockoutjs
@{
var initialData = new JavaScriptSerializer().Serialize(Model);
}
var data = @Html.Raw(initialData);
function ViewModel(data) {
var self = this;
self.Name = ko.observable(data.Name);
self.Items = ko.observableArray(data.Items);
self.addItem = function() { self.Items.push(""); };
self.removeItem = function(data) { self.Items.remove(data); }
}
$(document).ready(function() {ko.applyBindings(new ViewModel(data)); });
और निम्नलिखित दृश्य:: मैं निम्नलिखित ViewModel है
<div>
Name: <span data-bind="text: Name"></span>
</div>
<div>
Items: <button data-bind="click: addItem">Add Item</button>
</div>
<div>
<table>
<tbody data-bind="template: { name: 'itemTemplate', foreach: Items }"></tbody>
</table>
</div>
<script type="text/html" id="itemTemplate">
<tr>
<td>
<input data-bind="value: $data" />
<a href="#" data-bind="click: function() {$parent.removeItem($data)}">Remove Item</a>
</td>
</tr>
</script>
सब कुछ removeItem को छोड़कर सही ढंग से काम करने लगता है। जब नई पंक्तियां जोड़ दी जाती हैं, और "आइटम निकालें" को खाली नई पंक्ति पर क्लिक किया जाता है, तो सभी नई पंक्तियों को इसके साथ हटा दिया जाएगा। मैंने इसे काम करने के लिए प्रयास करने के लिए कई नॉकआउट ट्यूटोरियल देखे हैं, और मेरी विधि एक वैध प्रयास प्रतीत होती है, लेकिन जाहिर है ... मुझे कुछ याद आना चाहिए। कोई सुझाव?
मुझे वास्तव में jsfiddle पर आपका दृष्टिकोण पसंद है, लेकिन मैंने यह उल्लेख नहीं किया कि मुझे इस मॉडल को सर्वर पर वापस पोस्ट करने की आवश्यकता होगी। इसका मतलब है कि 'आइटम' को एक स्ट्रिंग होना चाहिए []। तो मैं अनुमान लगा रहा हूं कि इसका मतलब है कि मुझे $ इंडेक्स रूट जाना चाहिए, सही? –
जरूरी नहीं है। यह सुनिश्चित करने के कई तरीके हैं कि जेएसओएन आउटपुट उस राज्य में वापस आ जाए जो आप चाहते हैं। मैं जवाब के लिए कुछ जानकारी होगी। –
अगर मैं कर सकता तो मैं आपको दो अप्स दूंगा। बहुत उपयोगी जवाब। –