ActionSheetComponent
Represents the Kendo UI ActionSheet component for Angular. Use this component to display a set of choices related to a user-initiated task in a modal sheet that slides up from the bottom of the screen.
Definition
Package:@progress/kendo-angular-navigation
Selector:kendo-actionsheet
Export Name:Accessible in templates as #kendoActionSheetInstance="kendoActionSheet"
Syntax:
<kendo-actionsheet [items]="actionItems" [expanded]="true">
</kendo-actionsheet>Inputs
Specifies the action buttons displayed in the ActionSheet footer.
Configures the layout of the action buttons in the footer. By default, actions are arranged horizontally and stretched to fill the container.
animation
boolean | ActionSheetAnimation
Configures the opening and closing animations for the ActionSheet (see example).
true
cssClass
any
Applies CSS classes to the inner ActionSheet element. Accepts any value supported by ngClass.
cssStyle
any
Applies inline styles to the inner ActionSheet element. Accepts any value supported by ngStyle.
expanded
boolean
Controls whether the ActionSheet is expanded or collapsed.
false
Provides the collection of items rendered in the ActionSheet content area.
overlayClickClose
boolean
Determines whether the ActionSheet closes when the overlay is clicked.
false
subtitle
string
Sets the subtitle text displayed below the title in the header.
title
string
Sets the title text displayed in the ActionSheet header.
titleId
string
Sets the aria-labelledby attribute of the ActionSheet wrapper element.
Use this option when the built-in header element is replaced through the ActionSheetHeaderTemplate
or ActionSheetContentTemplate.
Events
Fires when any of the ActionSheet action buttons is clicked.
collapse
EventEmitter<any>
Fires when the ActionSheet is collapsed and its animation is complete.
expand
EventEmitter<any>
Fires when the ActionSheet is expanded and its animation is complete.
expandedChange
EventEmitter<boolean>
Fires when the expanded property of the component is updated.
You can use this event to provide two-way binding for the expanded property.
Fires when an ActionSheet item is clicked.
overlayClick
EventEmitter<any>
Fires when the modal overlay is clicked.
Methods
Toggles the visibility of the ActionSheet.