diff --git a/docs/_sass/custom/custom.scss b/docs/_sass/custom/custom.scss index 0b3d5158..a935adc2 100644 --- a/docs/_sass/custom/custom.scss +++ b/docs/_sass/custom/custom.scss @@ -25,3 +25,8 @@ } } } + +h3 > code { + // fix font size of code block in heading + font-size: 1.0rem; +} diff --git a/docs/views/template-syntax/view-attributes.md b/docs/views/template-syntax/view-attributes.md index 107cf6d6..709a92fe 100644 --- a/docs/views/template-syntax/view-attributes.md +++ b/docs/views/template-syntax/view-attributes.md @@ -188,6 +188,42 @@ this.container.querySelectorAll('*'); this.modal.close(); ``` + +### `as-array` attribute + +Similar to the `as` attribute, a property with the provided name is made available on the component, but in this case the value is an array of multiple references. This is useful in an `each` block, to provide a reference in the controller to every individual item. + +```jinja +{{each items as #item, #index}} + {{#item}} +{{/each}} +``` + +```js +this.itemEditor[index]; // references the Component or DOM element for item at `index` +``` + +### `as-object` attribute + +Similar to the `as-array` attribute, a property with the provided name is made available on the component, but with the value being a map-like object. The second argument to `as-object` specifies the key for each entry. + +```jinja +