HTML 콘텐츠가 작동하지 않는 경우

Question

HTML 사이에 변수 내용을 추가하려고하면 JSON 호출 후 표시되지 않습니다. 그러나 더미 값으로 초기화하면 해당 내용이 표시됩니다. 여기에 내 코드

{ 
    xtype: 'panel', 
    height:'115px', 
    html:['<div style="margin:0px;background:#fff;" >'+ 
      '<table style="margin:0px;padding:0px;height:40px;" width="100%" >'+ 
      '<tr><td style="padding:2px;width:40%;"><span><img src="data:image/jpeg;base64,{userImage}" height="100px" width="100px"/>'+ 
      '</span></td>'+ 
      '<td align="center" style="padding-left:2px ;width:60%;"><font color="black">'+App.gvars.fusername+'</font><br><p style="background-color:blue;"><font color="white">ITEMS COUNT : 155</font></p>'+ 
      '</td></tr></table></div>'].join(), 
    } 

App.gvars.fusername 내용이 표시되지 않는, 내가 어떤 temprory 값 App.gvars.fusername 내용 = "테스트", 그 작업을 초기화하는 경우! 이 코드의 문제는 무엇입니까? 제발 도와주세요

Answer 1

문제는 App.gvars.fusername이 JSON 응답에서 설정되기 전에 패널이 생성된다는 것입니다. 필요한 데이터를 얻은 후에 콘텐츠를 업데이트 할 수 있도록 html 대신 tpl을 사용해야합니다.

{ 
    xtype: 'panel', 
    height: '115px', 
    itemId: 'my-panel', 
    tpl: [ 
     //... 
     '<font color="black">{fusername}</font> 
     //... 
    ] 
} 

그런 다음, 당신이 당신의 JSON 응답을 얻을 때, 당신은 tpl를 업데이트 할 수 있습니다.

panel.update({ 
    fusername: App.gvars.fusername 
}):