প্রচুর ভিউমোডেলগুলি একক দর্শন সহ খুব বড় প্রকল্প শেষ করার পরে এটি আমার উত্তর।
এইচটিএমএল ভিউ
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<div id="container1">
<ul>
<li >Container1 item</li>
<!-- ko foreach: myItems -->
<li>Item <span data-bind="text: $data"></span></li>
<!-- /ko -->
</ul>
</div>
<div id="container2">
<ul>
<li >Container2 item</li>
<!-- ko foreach: myItems -->
<li>Item <span data-bind="text: $data"></span></li>
<!-- /ko -->
</ul>
</div>
<script src="js/jquery-1.11.1.js"></script>
<script src="js/knockout-3.0.0.js"></script>
<script src="js/DataFunction.js"></script>
<script src="js/Container1ViewModel.js"></script>
<script src="js/Container2ViewModel.js"></script>
</body>
</html>
এই দেখার জন্য আমি দুটি পৃথক জাভাস্ক্রিপ্ট ফাইলগুলিতে আইডি = ধারক 1 এবং আইডি = ধারক 2 এর জন্য 2 টি ভিউ মডেল তৈরি করছি।
Container1ViewModel.js
function Container1ViewModel()
{
var self = this;
self.myItems = ko.observableArray();
self.myItems.push("ABC");
self.myItems.push("CDE");
}
Container2ViewModel.js
function Container2ViewModel() {
var self = this;
self.myItems = ko.observableArray();
self.myItems.push("XYZ");
self.myItems.push("PQR");
}
এর পরে এই 2 ভিউমোডালগুলি ডেটাফানশন.জেজে আলাদা ভিউমোডেল হিসাবে নিবন্ধভুক্ত করছে
var container1VM;
var container2VM;
$(document).ready(function() {
if ($.isEmptyObject(container1VM)) {
container1VM = new Container1ViewModel();
ko.applyBindings(container1VM, document.getElementById("container1"));
}
if ($.isEmptyObject(container2VM)) {
container2VM = new Container2ViewModel();
ko.applyBindings(container2VM, document.getElementById("container2"));
}
});
এটির মতো আপনি পৃথক ডিভের জন্য যে কোনও সংখ্যক ভিউ মডেল যুক্ত করতে পারেন। তবে নিশ্চিত হয়ে নিন যে নিবন্ধিত ডিভের ভিতরে কোনও ডিভের জন্য আলাদা ভিউ মডেল তৈরি করবেন না।
masterVM।