--- page: 'reference-detail' title: 'ons-list-item' name: 'ons-list-item' collection: 'components' reference: true docCategory: 'js' componentCategory: list ---

ons-list-item

Component that represents each item in the list. Must be put inside the ons-list component.

Usage #

<ons-list>
  <ons-list-header>Header Text</ons-list-header>
  <ons-list-item>Item</ons-list-item>
  <ons-list-item>Item</ons-list-item>
</ons-list>

Live Example #

See the Pen Alert, confirm and prompt dialogs by Onsen & Monaca (@onsen) on CodePen.

See also #

Attributes #

Name Type
Default Value
Description
modifier String The appearance of the list item. Optional

Preset Modifiers #

Modifier Description
tappable Made the list item change appearance when it's tapped.
chevron Display a chevron at the right end of the list item and make it change appearance when tapped.

Discussion #