Statement: This is purely learning, blind, the true principle of implementation is not so
Demo.html
<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "UTF-8"> <Metahttp-equiv= "X-ua-compatible"content= "Ie=edge,chrome=1"> <Metaname= "Renderer"content= "WebKit"> <title>Title</title> <Scriptsrc= "Http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></Script></Head><Body><DivID= "Demo1"> <!--Ng-bind -</Div><H1>=================================================</H1><DivID= "Demo2"> <!--ng-bind-html -</Div><Script> /** * GET data * scare JB play Ng-bind*/$.post ('Data.json', function(data) {//Get Template$.get ('html/tpl01.html', function(getData) { for (varI= 0, Len=data.length; I<Len; I++) { var_clonehtml=GetData for (varKeyinchData[i]) { //Direct Replacement_clonehtml=_clonehtml.replace ('{{' +Key+ '}}', Data[i][key])} $('#demo1'). Append (_clonehtml)})})/** * GET data * scare JB play ng-bind-html*/$.post ('Data.json', function(data) {//Get Template$.get ('html/tpl02.html', function(getData) { for (varI= 0, Len=data.length; I<Len; I++) { $('#demo2'). Append (GetData) for (varKeyinchData[i]) { //custom tags, which must be looped here, otherwise when I equals a few $ (' [ng-bind-html= ' + key + ' "] ') the length of the bit array obtained is just a few, resulting in the inability to bind the following values $('[ng-bind-html=]' +Key+ '"]'). each (function () { if(!$( This). Hasclass ('Ng-bind')){ $( This). HTML (Data[i][key]). addclass ('Ng-bind') } }) } } }) })</Script></Body></HTML>
Html/tpl01.html
< H1 > {{Name}} </ H1 > < H2 > {{Age}} </ H2 > < H3 > {{Sex}} </ H3 >
Html/tpl02.html
<ng-bind-html= "name"></H1>< ng-bind-html= "Age"></h2>< ng-bind-html= "Sex"></h3>
Next: Blind Engage React:ReactDom.render ()
Blind ng-bind-html and Ng-bind realization