The code is probably as follows:
The code is as follows |
Copy Code |
<div id= "Example" data-template= "Category-template" data-bind= "Source:blog" ></div> <script id= "Category-template" type= "text/x-kendo-template" ><!--classification Template--> <div> <H2 data-bind= "Text:category" ><div data-bind= "source:posts" data-template= "Post-template" ></div> </div> </script> <script id= "Post-template" type= "Text/x-kendo-template" > <div> <H2 data-bind= "Text:title" ><div data-bind= "Text:content" ></div> </div> </script> <script type= "Text/javascript" > var ViewModel = kendo.observable ({ Blog: [ {Category: "Casually said, Posts: [{" title ":" Chen San Blog "," Content ":" This is a grassy place "}, {" title ":" Summer Coming "," content ":" Where to go? "}]}, {Category: "Front-End Development", Posts: [{"title": "JavaScript Closures", "content": "What does the closure mean"}, {"title": "Summer Coming", "content": "Where To Go"}]} ] }); Kendo.bind ($ ("#example"), ViewModel); </script> |
The rendered results can be seen jsbin links.
The comparison chart is as follows:
Under IE8, the rendering is incomplete and some data is missing.
The reason for the final finding is the comments in the code:
<!--classification template-->
because I write it in the Kendo custom script tag, so IE8 under the problem, move out after return to normal. This is a very subtle but also a very good problem of the pit dad.