<b:include>
используется для включения в описание шаблона другого описания (шаблона).
Для тега можно указать следующие атрибуты:
src
– ссылка на подключаемое описание, это может быть:
путь к файлу; относительные пути (начинаются не с /
) разрешаются относительно файла шаблона или относительно корня приложения, если описание находится не в отдельном файле;
<b:include src="./path/to/file.tmpl"/>
имя шаблона определенное с помощью basis.template.define
(подробнее "Темы")
<b:include src="foo.bar.baz"/>
ссылка вида #N
, где N
- идентификатор шаблона (значение свойства templateId
); в основном используется внутренними механизмами.
<b:include src="#123"/>
ссылка вида id:name
, где name
- значение атрибута id
у тега <script type="text/basis-template">
. Если элемент успешно найден в документе, то для описания шаблона используется его содержимое.
<b:include src="id:my-template"/>
no-style
– включается только разметка, все стили игнорируется.
isolate
– указывает, что стили и разметку нужно изолировать перед включением; в качестве значения указывается префикс, который подставляется всем класса, а если атрибут не имеет значения, то генерируется случайный; подробнее в Изоляция стилейrole
– позволяет задать пространство имен для ролей в подключаемой разметке; подробнее в Ролиid
→ <b:set-attr name="id" value="(значение атрибута)">
class
→ <b:append-class value="(значение атрибута)">
ref
→ <b:add-ref name="(значение атрибута)">
show
→ <b:show expr="(значение атрибута)">
hide
→ <b:hide expr="(значение атрибута)">
visible
→ <b:visible expr="(значение атрибута)">
hidden
→ <b:hidden expr="(значение атрибута)">
Исходный шаблон:
<b:include src="./foo.tmpl" id="foo" class="extra-class with_{binding}"/>
foo.tmpl:
<div class="example"/>
Результат:
<div id="foo" class="example extra-class with_{binding}"/>
Внутри <b:include>
могут быть другие специальные теги-инструкции, предназначенные для модификации подключаемого описания:
<b:before>
– вставлка до узла<b:after>
– вставка после узла<b:prepend>
– вставка в начало элемента<b:append>
– вставка в конец элемента<b:replace>
– замена узела<b:remove>
– удаление узла<b:attr>
, <b:set-attr>
– установка атрибута<b:append-attr>
– добавление значения к значению атрибута<b:remove-attr>
– удаление атрибута<b:class>
, <b:append-class>
– добавление класса (классов) в атрибут class
;<b:set-class>
– замещение значения атрибута class
<b:add-ref>
– добавление ссылки на узел<b:remove-ref>
– удаление ссылки на узел<b:role>
, <b:set-role>
– установка маркера роли<b:remove-role>
– удаление маркера роли<b:show>
, <b:hide>
, <b:visible>
, <b:hidden>
– установление соотвествующего специального атрибута на элементCодержимое этого тега вставляется перед узлом с указанной ссылкой. Атрибут ref
должен содержать название ссылки на узел, а если такого атрибута нет или в подключаемом описании нет узла с такой ссылкой, то данный тег игнорируется.
<b:include src="./foo.tmpl">
<b:before ref="label">
[inserted content]
</b:before>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label}>{title}</span>
</div>
Результат:
<div class="example">
[inserted content]
<span{label}>{title}</span>
</div>
Работает так же как и <b:before>
, но вставка происходит после указанного узла.
<b:include src="./foo.tmpl">
<b:after ref="label">
[inserted content]
</b:after>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label}>{title}</span>
</div>
Результат:
<div class="example">
<span{label}>{title}</span>
[inserted content]
</div>
Инструкци вставляет содержимое в начало элемента с указаной в атрибуте ref
ссылкой. Если атрибут отсутствует, то используется ссылка element
. Если узла с указанной ссылкой нет или узел не является элементом, то тег игнорируется.
<b:include src="./foo.tmpl">
<b:prepend ref="label">
[inserted content]
</b:prepend>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label}>{title}</span>
</div>
Результат:
<div class="example">
<span{label}>[inserted content]{title}</span>
</div>
Работает так же, как и <b:prepend>
, но вставляет содержимое в конец элемента.
<b:include src="./foo.tmpl">
<b:append ref="label">
[inserted content]
</b:append>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label}>{title}</span>
</div>
Результат:
<div class="example">
<span{label}>{title}[inserted content]</span>
</div>
Инструкция заменяет содержимым узел с указаной в атрибуте ref
ссылкой. Если атрибут отсутствует, то используется ссылка element
. Если узла с указанной ссылкой нет или узел не является элементом, то тег игнорируется.
<b:include src="./foo.tmpl">
<b:replace ref="label">
[new content]
</b:replace>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label}>{title}</span>
</div>
Результат:
<div class="example">
[new content]
</div>
Инструкция заменяет содержимым узел с указаной в атрибуте ref
ссылкой. Если атрибут отсутствует, то используется ссылка element
. Если узла с указанной ссылкой нет или узел не является элементом, то тег игнорируется.
<b:include src="foo.tmpl">
<b:remove ref="label"/>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label}>{title}</span>
<span>{value}</span>
</div>
Результат:
<div class="example">
<span>{value}</span>
</div>
Уставливает атрибут с именем name
и значением value
элементу с ссылкой ref
.
<b:include src="./foo.tmpl">
<b:attr ref="label" name="foo" value="bar"/>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label}>{title}</span>
</div>
Результат:
<div class="example">
<span{label} foo="bar">{title}</span>
</div>
Добавляет значение к значению атрибута.
<b:include src="./foo.tmpl">
<b:append-attr ref="label" name="foo" value="def"/>
<b:append-attr ref="label" name="bar" value="baz"/>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label} foo="abc">{title}</span>
</div>
Результат:
<div class="example">
<span{label} foo="abcdef" bar="baz">{title}</span>
</div>
Удаляет атрибут.
<b:include src="./foo.tmpl">
<b:remove-attr ref="label" name="foo"/>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label} foo="abc">{title}</span>
</div>
Результат:
<div class="example">
<span{label}>{title}</span>
</div>
Добавляет класс (классы) в атрибут class
.
<b:include src="./foo.tmpl">
<b:class ref="label" value="foo foo_{selected}"/>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label} class="bar">{title}</span>
</div>
Результат:
<div class="example">
<span{label} class="bar foo foo_{selected}">{title}</span>
</div>
Замещает значение атрибута class
на новое значение;
<b:include src="./foo.tmpl">
<b:set-class ref="label" value="foo foo_{selected}"/>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label} class="bar">{title}</span>
</div>
Результат:
<div class="example">
<span{label} class="foo foo_{selected}">{title}</span>
</div>
Добавляет дополнительную ссылку узлу разметки.
<b:include src="./foo.tmpl">
<b:add-ref name="demo"/>
<b:add-ref ref="foo" name="bar"/>
</b:inclide>
foo.tmpl:
<div class="example">
<span{foo}/>
</div>
Эквивалентно:
<div{demo} class="example">
<span{foo|bar}/>
</div>
Добавляет дополнительную ссылку узлу разметки.
<b:include src="./foo.tmpl">
<b:remove-ref name="demo"/>
<b:remove-ref name="bar"/>
</b:inclide>
foo.tmpl:
<div{demo} class="example">
<span{foo|bar}/>
</div>
Эквивалентно:
<div class="example">
<span{foo}/>
</div>
Нет необходимости удалять ссылку
element
, так как она всегда удаляется из подключаемой разметки.
Устанавливает маркет роли на элемент. Подробнее в Роли
<b:include src="./foo.tmpl">
<b:set-role/>
<b:set-role ref="label" name="count"/>
</b:inclide>
foo.tmpl:
<div class="example">
<span{label}/>
</div>
Эквивалентно:
<div class="example" b:role>
<span{label} b:role="count"/>
</div>
В старых версиях basis.js вместо атрибута
name
использовался атрибутvalue
.
Удаляет маркет роли с элемента. Подробнее в Роли
<b:include src="./foo.tmpl">
<b:remove-role/>
<b:remove-role ref="label"/>
</b:inclide>
foo.tmpl:
<div class="example" b:role>
<span{label} b:role="something"/>
</div>
Эквивалентно:
<div class="example">
<span{label}/>
</div>
Устанавливает соответствующий атрибут заданному элементу.
<b:include src="./foo.tmpl">
<b:show expr="{expr1}"/>
<b:hide ref="a" expr="{expr2}"/>
<b:visible ref="b" expr="{expr3}"/>
<b:hidden ref="c" expr="{expr4}"/>
</b:inclide>
foo.tmpl:
<div class="example" b:hide="{something}">
<span{a}/>
<span{b}/>
<span{c}/>
</div>
Эквивалентно:
<div class="example" b:show="{expr1}">
<span{a} b:hide="{expr2}"/>
<span{b} b:visible="{expr3}"/>
<span{c} b:hidden="{expr4}"/>
</div>
Нужно заметить, что b:hide
в foo.tmpl
был отброшен, так как b:show
и b:hide
(как и b:visible
/b:hidden
) взаимообратные и выигрывает последний.
Подробнее про специальные атрибуты в Специальные атрибуты в шаблонах