Find your people. Pick a challenge. Ship something real. The CreatorCon Hackathon is coming to the Community Pavilion for one epic night. Every skill level, every role welcome. Join us on May 5th and learn more here.

Ashley Snyder
ServiceNow Employee
 Center of Excellence / UI Builder / EVAM versus Repeater Component

 

 

This blog post focuses on what both EVAM and repeaters are, how they can be used, and the differences in each. Repeater components are not a replacement for EVAM.  EVAM isn't a component in itself, it is an application that can produce a data resource to be used in UI Builder. Repeater components can even use EVAM generated data resources.

 

EVAM

 

EVAM or Entity Action View Mapper is an application that standardizes how different data resources display in card and list components in experiences that are configured with UI Builder. EVAM is not the data set or data row component that is used to display cards or lists, it is the application standardizes data and views of that data from different data resources or tables, and formats them in a schema that the data set/data row component can understand. It does have to be linked to a data set/data row component via a data resource on the UI Builder page. 

 

Some typical use cases may include:

  • Return a list of information or tasks from different tables (e.g. Search Results, My Tasks)
  • Configuring different data views using filters (All Open Requests vs All Closed Requests)
  • Configuring different actions for different records (e.g. Approve/Reject)

 

For a deep dive on what EVAM is, and how it can be utilized see the Now Learning Course: Introduction to Entity Action View Mapper. This course goes through what EVAM is, how it can be used in various formats, and how to set it up with a provided simulator to walk you through the process. The Getting started: Create a multi-data source list display in Entity View Action Mapper product documentation also walks through a typical scenario of displaying request and incident data to users.

 

Repeater

 

The repeater component is a component only found in UI Builder that allows users to repeat components or multiple components with results from a data resource. It is not a data resource in itself, and does not standardize data or views from different tables. It simply takes a JSON payload from a data resource and allows multiple components to map to the resource in the repeater component, rather than having to bind multiple components individually to the data resource. It is helpful to think of a repeater as being similar to a for loop, it is configured with an array that you want to repeat over and for every item in the set, a component (or components) will render. 

Data is accessed in repeaters via the @item binding syntax, which contains three objects that can be used:

  • @item.value - Accesses a repeated item from a data set. Dot-walking can be done to access data within repeated objects. 
  • @item.index - Resolves to the index of the current item in the repeated array. An @item.index binding will resolve to 0 for the first element, 1 for the second element, etc.
  • @item.parent - Resolves to the @item binding for the immediate parent repeater. Useful for nested repeaters - repeaters within another repeater. Can be used to access two repeaters up or more. 

Like other components, event handlers can be set up for a component that is within a repeater container. Within the payload of an event being emitted by a repeated component, access to @item bindings is available.

 

For more information on repeaters see the Add repeaters in UI Builder product documentation and Next Experience COE UI Builder resource hub.

2 Comments