Extjs Template 두 가지 예제
3816 단어 template
코드는 다음과 같습니다.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Button</title>
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-4.0.7-commercial/resources/css/ext-all.css"/>
<script type="text/javascript" src="http://extjs.cachefly.net/ext-4.0.7-commercial/ext-all-debug.js"></script>
</head>
<body>
<div id="template1"></div>
<div id="template2"></div>
<script type="text/javascript">
<!--
var data = {
name: 'Tommy Maintz',
title: 'Lead Developer',
company: 'Sencha Inc.',
email: '[email protected]',
address: '5 Cups Drive',
city: 'Palo Alto',
state: 'CA',
zip: '44102',
drinks: ['Coffee', 'Soda', 'Water'],
kids: [{
name: 'Joshua',
age:3
},
{
name: 'Matthew',
age:2
},
{
name: 'Solomon',
age:0
}]
};
var tpl = new Ext.XTemplate(
'<p>Kids: ',
'<tpl for=".">',
'<p>{#}. {name}</p>',
'</tpl></p>'
);
tpl.overwrite("template1", data.kids);
var tpl = new Ext.XTemplate(
'<p>Name: {name}</p>',
'<p>Title: {title}</p>',
'<p>Company: {company}</p>',
'<p>Kids: ',
'<tpl for="kids">',
'<p>{name}</p>',
'</tpl></p>'
);
tpl.overwrite("template2", data);
//-->
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Button</title>
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-4.0.7-commercial/resources/css/ext-all.css"/>
<script type="text/javascript" src="http://extjs.cachefly.net/ext-4.0.7-commercial/ext-all-debug.js"></script>
</head>
<body>
<div id="template1"></div>
<div id="template2"></div>
<script type="text/javascript">
<!--
var container = Ext.create('Ext.Container', {
renderTo: Ext.getBody(),
items : [{
xtype: 'button',
text : 'My Button'
}]
});
var t = new Ext.Template("<div>Hello {0}.</div>");
t.append(container.getEl(), ['foo']);
var t = new Ext.Template([
'<div name="{id}">',
'<span class="{cls}">{name:trim} {value:ellipsis(10)}</span>',
'</div>',
]);
t.compile();
t.append('template2', {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'});
//-->
</script>
</body>
</html>
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Visual studio 2017에서 빨리 파이썬을 코딩<<준비>> VS2017에서 Raspberry PI에 액세스할 수 있도록 한다. /etc/samba/smb.conf에 추가 /etc/samba/smb.conf samba 재부팅 새 프로젝트에서 템플릿 Bottle 웹...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.