<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>JQuery templ Binding Demo</title> <script src="../../Scripts/jquery-2.1.1.min.js"></script> <script src="../../Scripts/jquery.tmpl.min.js"></script> <script src="../../Scripts/knockout-3.2.0.js"></script> <script> $(document).ready(function () { function myViewModel() { var self = this; self.employees = [{name:'Sudheer',age:24}, {name:'Sumanth',age:25}]; }; ko.applyBindings(new myViewModel()); }); </script> </head> <body> <div data-bind="template:'my-Template'"></div> <script type="text/html" id="my-Template"> {{each employees}} <p>Name: ${name}</p> <p>Age : ${age}</p> {{/each}} </script> </body> </html>
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Component Registration Demo</title> <script src="../../Scripts/jquery-2.1.1.min.js"></script> <script src="../../Scripts/jquery.tmpl.min.js"></script> <script src="../../Scripts/knockout-3.2.0.js"></script> <script> $(document).ready(function () { ko.components.register('name-widget', { viewModel: function (params) { this.employeeModel = params.value; this.employeeName = this.employeeModel.name; }, template: "<p><span>${employeeName}</span></p>" }); function employeeInfoViewModel() { this.employee = {name:'Sudheer',age:24}; }; ko.applyBindings(new employeeInfoViewModel()); }); </script> </head> <body> <p><name-widget params="value: employee"></name-widget></p> </body> </html>
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)