Ext template
2174 단어 extColdFusion
Author: Aaron Conran
Translater: Frank Cheung
Published: May 16, 2007
이 강좌는 Ext의 템플릿 엔진을 바탕으로 상세한 설명을 전개하고 Shea Frederick 강좌에 대한 보충이기도 하다.독자가 템플릿(Templates)과 포맷 함수의 기본 문법을 "{VARIABLE:[(선택 가능한 매개 변수)]}"로 초보적으로 접촉했다고 가정합니다.
본격적으로 시작하다
만약 우리가 한 변수에서 내용을 인쇄하려고 한다면, 그 중의 내용은 너무 많은 공간을 차지할 수 있다.이런 상황에 대해 이 내용을 캡처하여 50개의 영문 문자로 제한한 다음 연결을 만들어 사용자가 클릭한 후 전문을 관찰하도록 하는 방법이 있다.함수'ellipsis'의 기능은 바로 이렇습니다. 임의의 문자 수로 제한할 수 있습니다.또한 문자열을 캡처한 뒤에는 "..."함수가 추가되어 실제 내용이 더 많음을 나타냅니다. 템플릿은 다음과 같습니다.
var myTpl = new Ext.Template('<div>{content:ellipsis(50)}<br/><a href="{moreLink}">Read More</a></div>');
처리를 통해 47개의 문자는 내용 자체에 속하고, 다른 세 개의 문자는 "...","총 50자입니다. 템플릿에 사용할 수 있는 포맷 함수 목록입니다.
.htmlEncode - 변환(&, <,>, and') 문자
사용자 정의 포맷 함수를 만들 수도 있습니다. 구체적인 방법은 템플릿의 실례에 새로운 방법을 추가하고 템플릿에서 호출하는 것입니다. 포맷 함수는 다음과 같습니다. "{VARIABLE:this.}"이것은 간단한 실례입니다. 템플릿 실례에'yesNoFormat'이라는 새로운 함수를 추가합니다.yesNoFormat은 ColdFusion 변환 truthy 함수와 유사합니다. 만약 실제 출력 "Yes"라면 가짜 출력 "No"입니다.
var testCustomTpl = new Ext.Template('<div>User: {username} IsRevoked: {revoked:this.yesNoFormat}</div>');
testCustomTpl.yesNoFormat = function(value) {
return value ? 'Yes' : 'No';
};
testCustomTpl.append(document.body, {username: 'aconran', revoked: 1});이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
ExtJS 3.2 학습 노트(3) 사용자 정의 이벤트Extjs에서 모든 상속은 Ext.util에서 합니다.Observable 클래스의 컨트롤은 이벤트를 지원할 수 있습니다. 클래스에 대해 이벤트를 사용자 정의하려면 다음 절차를 따르십시오. 1, 먼저 클래스를 정의합니...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
