Usage
Signature:
interface CConveyorBeltElement
Typescript Import Format
//To typecheck the element APIs, import as below.
import { CConveyorBeltElement } from "oj-c/conveyor-belt";
//For the transpiled javascript to load the element's module, import as below
import "oj-c/conveyor-belt";
For additional information visit:
Note: Application logic should not interact with the component's properties or invoke its methods until the BusyContext indicates that the component is ready for interaction.
Slots
JET components that allow child content support slots. Please see the slots section of the JET component overview doc for more information on allowed slot content and slot types.
-
Default
-
The default slot is the content of the Conveyor Belt.
-
itemTemplate
-
The
itemTemplate
slot is used to specify the template for rendering each item in the Conveyor Belt. The slot content must be a <template> element.When the template is executed for each item, it will have access to the binding context containing the following properties:
- $current - an object that contains information for the current item.
Properties of $current:
Name Type Description data
D The data of the item. Note this is made available primarily to ease migration. Applications should get the data from the item property instead. item
Item.<K, D> Contains the data and metadata of the item.
Attributes
-
arrow-visibility :"auto"|"hidden"|"visible"
-
Indicates whether overflow content arrows are visible or hidden.
The default value of this property varies by theme. If the default value is 'auto', then the behavior varies by device.
Names
Item Name Property arrowVisibility
Property change event arrowVisibilityChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.) on-arrow-visibility-changed
-
items :(Array.<oj-c.ConveyorBelt.ConveyorBeltArrayDataItem.<K, D>>|DataProvider.<K, D>)
-
An array of data items or a data provider that returns the items for the ConveyorBelt.
Names
Item Name Property items
Property change event itemsChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.) on-items-changed
-
orientation :"horizontal"|"vertical"
-
Specify the orientation of the conveyorBelt. "horizontal" Orient the conveyorBelt horizontally. "vertical" Orient the conveyorBelt vertically.
- Default Value:
"horizontal"
Names
Item Name Property orientation
Property change event orientationChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.) on-orientation-changed
-
scroll-position :number
-
Gets or sets the number of pixels that an element's content is scrolled from its initial position.
The default value of this property is 0.
There is no difference between LTR/RTL value assignment. In both LTR and RTL values changes from 0 and max scroll position >=0 if we scroll to the end. If we scroll to the beginning then the values changes from max scroll position >=0 to min scroll position = 0 When the value exceeds max/min the value is constrained to the max/min scroll position accordingly.
- Supports writeback:
true
Names
Item Name Property scrollPosition
Property change event scrollPositionChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.) on-scroll-position-changed
Methods
-
getProperty(property) : {any}
-
Retrieves the value of a property or a subproperty.
Parameters:
Name Type Description property
The property name to get. Supports dot notation for subproperty access. Returns:
- Type
- any
-
scrollElementIntoView(element) : {void}
-
Scrolls element into view.
Parameters:
Name Type Description element
Returns:
- Type
- void
-
setProperties(properties) : {void}
-
Performs a batch set of properties.
Parameters:
Name Type Description properties
An object containing the property and value pairs to set. Returns:
- Type
- void
-
setProperty(property, value) : {void}
-
Sets a property or a single subproperty for complex properties and notifies the component of the change, triggering a corresponding event.
Parameters:
Name Type Description property
The property name to set. Supports dot notation for subproperty access. value
The new value to set the property to. Returns:
- Type
- void