kncoutjs 模板的使用

怪怪517

于 2014-05-16 12:12:54 发布

阅读量637

点赞数

本文链接：https://blog.csdn.net/huanxue517/article/details/25964899

版权

最近在学习kncoutjs,在这条路上慢慢的爬行，现在把自己的一点心得贴出来，让大家看看。

<script type="text/javascript">  
	
	
	 var GiftModel =function(searchname, tempName) {
	    this.searchname = searchname;
	    this.tempName = tempName;
<pre code_snippet_id="348591" snippet_file_name="blog_20140516_1_4620557" class="html" name="code"><script type="text/javascript" src="${path}/js/plugins/jquery-1.8.3.js"></script>
       	}
	
	 function MyViewModel() {       
		   this.buyer = { name: 'Franklin', credits: 250 };    
		   this.seller =  [
                    	    { searchname: "Tall Hat", tempName: "39.95"},
                    	    { searchname: "Long Cloak", tempName: "120.00"}
                    	];    
		 }     
	 $(function(){
		 ko.applyBindings(new MyViewModel()); 
		});
  </script> 
<body>

<h2>Participants</h2>
 Here are the participants: 
 <div data-bind="template: { name: 'person-template', data: buyer }"></div> 
 <div data-bind="template: { name: 'search-template', foreach: seller }"></div> 
 <input type="submit" value="提交">
   
 
 
 
 <script type="text/html" id="person-template">     
 	<h3 data-bind="text: name"></h3>    
 	<p>Credits: <span data-bind="text: credits"></span></p>
 </script> 
 
<script type="text/html" id="search-template">   
 <h3 data-bind="text: searchname"></h3>    
 <p><input  data-bind="value: tempName" ></p> 
 </script>