projects/congarevenuecloud/elements/src/lib/icon/spinner/spinner.component.ts

An animated spinner built from the bootstrap library to be used to show loading status.

Example :

import { IconModule } from '@congarevenuecloud/elements';

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

Example :

// Basic usage
```typescript
<apt-spinner></apt-spinner>

Example :

// Small spinner
```typescript
<apt-spinner [large]="false"></apt-spinner>

// Change color of spinner with bootstrap text color class.

Example :

<apt-spinner color="text-warning"></apt-spinner>

changeDetection	`ChangeDetectionStrategy.OnPush`
selector	`apt-spinner`
styles	`.spinner-width{ border-radius: 50% }`
template	`<div class=spinner-width [class]="'spinner-border ' + color" [class.spinner-border-sm]="!large" role="status" > <span class="sr-only">Loading...</span> </div>`

color

Type :

"text-primary" | "text-secondary" | "text-success" | "text-danger" | "text-warning" | "text-info" | "text-light" | "text-dark"

Default value : 'text-primary'

Bootstrap text color class to set the color of the dots.

large

Type : boolean

Default value : true

Flag to set the dots to a larger size.


  .spinner-width{
    border-radius: 50%
  }

Legend

Html element

Component

Html element with directive

results matching ""

No results matching ""