com.vaadin.flow.data.renderer

Class TemplateRenderer<SOURCE>

java.lang.Object

com.vaadin.flow.data.renderer.Renderer<SOURCE>

com.vaadin.flow.data.renderer.TemplateRenderer<SOURCE>

Type Parameters:

SOURCE - the type of the input object used inside the template

All Implemented Interfaces:

Serializable

public final class TemplateRenderer<SOURCE>
extends Renderer<SOURCE>

Helper class to create Renderer instances, with fluent API.

Since:

1.0.

Author:

Vaadin Ltd

See Also:

of(String), https://www.polymer-project.org/2.0/docs/devguide/templates, Serialized Form

Method Summary

Modifier and Type	Method and Description
static <SOURCE> TemplateRenderer<SOURCE>	of(String template) Creates a new TemplateRenderer based on the provided template.
TemplateRenderer<SOURCE>	withEventHandler(String handlerName, SerializableConsumer<SOURCE> handler) Sets an event handler for events from elements inside the template.
TemplateRenderer<SOURCE>	withProperty(String property, ValueProvider<SOURCE,?> provider) Sets a property to be used inside the template.

Methods inherited from class com.vaadin.flow.data.renderer.Renderer

getEventHandlers, getValueProviders, render, render, setEventHandler, setProperty

Methods inherited from class java.lang.Object

clone, equals, finalize, getClass, hashCode, notify, notifyAll, toString, wait, wait, wait

Method Detail

of

public static <SOURCE> TemplateRenderer<SOURCE> of(String template)

Creates a new TemplateRenderer based on the provided template. The template accepts anything that is allowed inside a <template> element, and works with Polymer data binding syntax.

Examples:

 
 // Prints the index of the item inside a repeating list
 TemplateRenderer.of("[[index]]");

 // Prints the property of an item
 TemplateRenderer.of("<div>Property: [[item.property]]</div>");
 
 

Type Parameters:

SOURCE - the type of the input object used inside the template

Parameters:

template - the template used to render items, not null

Returns:

an initialized TemplateRenderer

See Also:

withProperty(String, ValueProvider)

withProperty

public TemplateRenderer<SOURCE> withProperty(String property,
                                             ValueProvider<SOURCE,?> provider)

Sets a property to be used inside the template. Each property is referenced inside the template by using the [[item.property]] syntax.

Examples:

 
 // Regular property
 TemplateRenderer.<Person> of("<div>Name: [[item.name]]</div>")
          .withProperty("name", Person::getName);

 // Property that uses a bean. Note that in this case the entire "Address" object will be sent to the template.
 // Note that even properties of the bean which are not used in the template are sent to the client, so use
 // this feature with caution.
 TemplateRenderer.<Person> of("<span>Street: [[item.address.street]]</span>")
          .withProperty("address", Person::getAddress);

 // In this case only the street field inside the Address object is sent
 TemplateRenderer.<Person> of("<span>Street: [[item.street]]</span>")
          .withProperty("street", person -> person.getAddress().getStreet());
 
 

Any types supported by the JsonSerializer are valid types for the TemplateRenderer.

Parameters:

property - the name of the property used inside the template, not null

provider - a ValueProvider that provides the actual value for the property, not null

Returns:

this instance for method chaining

withEventHandler

public TemplateRenderer<SOURCE> withEventHandler(String handlerName,
                                                 SerializableConsumer<SOURCE> handler)

Sets an event handler for events from elements inside the template. Each event is referenced inside the template by using the on-event syntax.

Examples:

 
 // Standard event
 TemplateRenderer.of("<button on-click='handleClick'>Click me</button>")
          .withEventHandler("handleClick", object -> doSomething());

 // You can handle custom events from webcomponents as well, using the same syntax
 TemplateRenderer.of("<my-webcomponent on-customevent=
    'onCustomEvent'></my-webcomponent>")
          .withEventHandler("onCustomEvent", object -> doSomething());
 
 

The name of the function used on the on-event attribute should be the name used at the handlerName parameter. This name must be a valid Javascript function name.

Parameters:

handlerName - the name of the handler used inside the on-event="handlerName", not null

handler - the handler executed when the event is triggered, not null

Returns:

this instance for method chaining

See Also:

https://www.polymer-project.org/2.0/docs/devguide/events