On this page

This component is part of CoreUI PRO – a powerful UI library with over 250 components and 25+ templates, designed to help you build modern, responsive apps faster. Fully compatible with Angular, Bootstrap, React.js, and Vue.js.

Angular Loading Button Component

Angular Buttons with built-in loading indicators. Indicate the loading state of the button bridging the gap between action and feedback.

Examples

Cancellable on click by default.

Border (default spinner)

Grow

Disabled on loading

Non cancellable on click.

API reference

LoadingButton Module

import { LoadingButtonModule } from '@coreui/angular';

@NgModule({
 imports: [LoadingButtonModule,]
})
export class AppModule() { }

cLoadingButton

directive

Inputs

name	description	type	default
`disabledOnLoading`	Makes button disabled when loading.	`boolean`	false
`loading`	Loading state (set to true to start animation).	`boolean`	false
`spinnerType`	Type of spinner.	`border` \| `grow`	border

Outputs

name	description	type
`loadingChange`	Event emitted on `loading` change.	`boolean`