@gluonjs/core / src / nothing
Variable: nothing
constnothing: typeofnothing
Explicitly renders no child content or removes an attribute value.
Example
Render no child content or remove a dynamic attribute without inserting a placeholder node or string:
import {
directive,
event,
getTemplateValueServerContract,
html,
isTemplateResult,
nothing,
repeat,
unsafeHTML,
unsafeURL,
type DirectiveDefinition,
type DirectiveFactory,
type DirectiveLifecycle,
type DirectiveRunner,
type Key,
type KeyedItem,
type PartController,
type PrimitiveValue,
type TemplateType,
type TemplateValue,
type TemplateValueServerContract,
} from '@gluonjs/core';
const primitive: PrimitiveValue = 'Ready';
const key: Key = 'orbit-lamp';
const products = repeat([{ id: key, name: 'Orbit Lamp' }], (product) => product.id, (product) => html`<li>${product.name}</li>`);
const keyed: KeyedItem | undefined = products.items[0];
const part: PartController = { setValue: (value) => console.log(value) };
const runner: DirectiveRunner = (target) => target.setValue(primitive);
const factory: DirectiveFactory<readonly [string]> = (value) => (target) => target.setValue(value);
const lifecycle: DirectiveLifecycle<readonly [string]> = {
mount: (target, [value]) => target.setValue(value),
update: (target, [value]) => target.setValue(value),
};
const definition: DirectiveDefinition<readonly [string]> = lifecycle;
const text = directive(definition);
const type: TemplateType = 'html';
const value: TemplateValue = html`<ul>${products}</ul>${text('Ready')}`;
const contracts: Array<TemplateValueServerContract | undefined> = [
getTemplateValueServerContract(products),
getTemplateValueServerContract(event(() => undefined)),
getTemplateValueServerContract(unsafeHTML('<strong>Trusted</strong>')),
getTemplateValueServerContract(unsafeURL('/manual.pdf')),
];
runner(part);
factory('Updated')(part);
console.log(type, isTemplateResult(value), keyed, contracts, nothing);