core/common/loading.component.ts
| selector | c8y-loading |
| standalone | true |
| imports |
NgIf
C8yTranslatePipe
|
| templateUrl | ./loading.component.html |
Inputs |
| layout |
Type : "component" | "application" | "page"
|
Default value : 'component'
|
|
Defining the layout of the loading component. By default the component loading activity is used. |
| message |
Type : string
|
Default value : null
|
|
Showing a message while loading. The application layout by default shows the label |
| progress |
Type : number
|
Default value : null
|
|
If set, a progress bar is shown. The layout property is ignored. |
<div
class="spinner p-relative"
*ngIf="layout === 'component' && progress === null"
>
<div class="rect1"></div>
<div class="rect2"></div>
<div class="rect3"></div>
<div class="rect4"></div>
<div class="rect5"></div>
</div>
<div
class="spinner-snake"
*ngIf="layout === 'application' && progress === null"
></div>
<div
class="loading-bar active"
*ngIf="layout === 'page' && progress === null"
></div>
<div
class="progress progress-striped active"
*ngIf="progress !== null"
>
<div
class="progress-bar"
[style.width]="progress + '%'"
[attr.aria-label]="'Progress' | translate"
aria-valuemin="0"
aria-valuemax="100"
[attr.aria-valuenow]="progress"
role="progressbar"
></div>
</div>
<p
class="text-center"
*ngIf="defaultLoadingMessage"
>
{{ defaultLoadingMessage | translate }}
</p>