ion-item-option

Contents

The option button for an ion-item-sliding. Must be placed inside of an <ion-item-options>. You can combine the ionSwipe event and the expandable directive to create a full swipe action for the item.

Properties

color

Description

The color to use from your application's color palette. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark". For more information on colors, see theming.

Attributecolor
Typestring | undefined

disabled

Description

If true, the user cannot interact with the item option.

Attributedisabled
Typeboolean
Defaultfalse

expandable

Description

If true, the option will expand to take up the available width and cover any other options.

Attributeexpandable
Typeboolean
Defaultfalse

href

Description

Contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered.

Attributehref
Typestring | undefined

mode

Description

The mode determines which platform styles to use.

Attributemode
Type"ios" | "md"

CSS Custom Properties

NameDescription
--backgroundBackground of the item option
--colorColor of the item option

Slots

NameDescription
Content is placed between the named slots if provided without a slot.
"bottom"Content is placed below the option text.
"end"Content is placed to the right of the option text in LTR, and to the left in RTL.
"icon-only"Should be used on an icon in an option that has no text.
"start"Content is placed to the left of the option text in LTR, and to the right in RTL.
"top"Content is placed above the option text.