X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..05ce1c11e98b33f14ddee184493bd5a60dc947e2:/docs/source/Template.html diff --git a/docs/source/Template.html b/docs/source/Template.html index 7385b3db..b56b41ba 100644 --- a/docs/source/Template.html +++ b/docs/source/Template.html @@ -1,25 +1,70 @@ - -
-/** + + ++ \ No newline at end of fileThe source code + + + + +/*! + * Ext JS Library 3.0.3 + * Copyright(c) 2006-2009 Ext JS, LLC + * licensing@extjs.com + * http://www.extjs.com/license + */ +/** * @class Ext.Template - * Represents an HTML fragment template. Templates can be precompiled for greater performance. - * For a list of available format functions, see {@link Ext.util.Format}.- +};
- * Usage: + *Represents an HTML fragment template. Templates may be {@link #compile precompiled} + * for greater performance.
+ *For example usage {@link #Template see the constructor}.
+ * + * @constructor + * An instance of this class may be created by passing to the constructor either + * a single argument, or multiple arguments: + *+ * @param {Mixed} config */ Ext.Template = function(html){ var me = this, @@ -41,14 +86,35 @@ Ext.Template = function(html){ /**@private*/ me.html = html; + /** + * @cfg {Boolean} compiled Specify true to compile the template + * immediately (see+ *
- single argument : String/Array + *
+ *+ * The single argument may be either a String or an Array:+ *
- String :
+ *+var t = new Ext.Template("<div>Hello {0}.</div>"); +t.{@link #append}('some-element', ['foo']); + *
- Array :
+ * An Array will be combined withjoin('')
.- * @constructor - * @param {String/Array} html The HTML fragment or an array of fragments to join("") or multiple arguments to join("") + *-var t = new Ext.Template( +var t = new Ext.Template([ '<div name="{id}">', '<span class="{cls}">{name:trim} {value:ellipsis(10)}</span>', - '</div>' -); -t.append('some-element', {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'}); + '</div>', +]); +t.{@link #compile}(); +t.{@link #append}('some-element', {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'});
- multiple arguments : String, Object, Array, ... + *
+ *+ * Multiple arguments will be combined withjoin('')
. + *+ *+var t = new Ext.Template( + '<div name="{id}">', + '<span class="{cls}">{name} {value}</span>', + '</div>', + // a configuration object: + { + compiled: true, // {@link #compile} immediately + disableFormats: true // See Notes below. + } +); + *
Notes:
+ *+ *+ *
- Formatting and
+ *disableFormats
are not applicable for Ext Core.- For a list of available format functions, see {@link Ext.util.Format}.
+ *- + *
disableFormats
reduces{@link #apply}
time + * when no formatting is required.{@link #compile}
). + * Defaults to false. + */ if (me.compiled) { me.compile(); } }; Ext.Template.prototype = { + /** + * @cfg {RegExp} re The regular expression used to match template variables. + * Defaults to:+ */ + re : /\{([\w-]+)\}/g, + /** + * See+ * re : /\{([\w-]+)\}/g // for Ext Core + * re : /\{([\w-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g // for Ext JS + *
{@link #re}
. + * @type RegExp + * @property re + */ + /** - * Returns an HTML fragment of this template with the specified values applied. - * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'}) + * Returns an HTML fragment of this template with the specifiedvalues
applied. + * @param {Object/Array} values + * The template values. Can be an array if the params are numeric (i.e.{0}
) + * or an object (i.e.{foo: 'bar'}
). * @return {String} The HTML fragment */ applyTemplate : function(values){ @@ -74,13 +140,6 @@ Ext.Template.prototype = { return compile ? me.compile() : me; }, - /** - * The regular expression used to match template variables - * @type RegExp - * @property - */ - re : /\{([\w-]+)\}/g, - /** * Compiles the template into an internal function, eliminating the RegEx overhead. * @return {Ext.Template} this @@ -134,10 +193,14 @@ Ext.Template.prototype = { }, /** - * Applies the supplied values to the template and appends the new node(s) to el. + * Applies the suppliedvalues
to the template and appends + * the new node(s) to the specifiedel
. + *For example usage {@link #Template see the constructor}.
* @param {Mixed} el The context element - * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'}) - * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined) + * @param {Object/Array} values + * The template values. Can be an array if the params are numeric (i.e.{0}
) + * or an object (i.e.{foo: 'bar'}
). + * @param {Boolean} returnElement (optional) true to return an Ext.Element (defaults to undefined) * @return {HTMLElement/Ext.Element} The new node or Element */ append : function(el, values, returnElement){ @@ -165,8 +228,10 @@ Ext.Template.prototype = { }; /** * Alias for {@link #applyTemplate} - * Returns an HTML fragment of this template with the specified values applied. - * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'}) + * Returns an HTML fragment of this template with the specifiedvalues
applied. + * @param {Object/Array} values + * The template values. Can be an array if the params are numeric (i.e.{0}
) + * or an object (i.e.{foo: 'bar'}
). * @return {String} The HTML fragment * @member Ext.Template * @method apply @@ -183,6 +248,6 @@ Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate; Ext.Template.from = function(el, config){ el = Ext.getDom(el); return new Ext.Template(el.value || el.innerHTML, config || ''); -};