core/alert/alert.service.ts
A service which allows to display alerts.
Methods |
Accessors |
add | ||||||
add(alert: Alert)
|
||||||
Adds a new alert to the current state.
Parameters :
Returns :
void
|
addByText |
addByText(type: alertType, txt: string, detailedData?: string)
|
Adds a alert by text.
Returns :
void
|
addServerFailure | |||||||||||||||
addServerFailure(error: any, type: alertType)
|
|||||||||||||||
Creates alert from standard api errors. Should be used for errors generated by @c8y/client services.
Parameters :
Returns :
void
|
areSame |
areSame(alert1: Alert, alert2: Alert)
|
Compares two alert objects. Alerts are same if text, type, detailed data and callbacks are same. Callbacks are same if they refer to the same function.
Returns :
boolean
|
clearAll |
clearAll()
|
Clears all alerts.
Returns :
void
|
danger | ||||||||||||
danger(text: string, detailedData?: string)
|
||||||||||||
A shorthand to display a simple danger message.
Parameters :
Returns :
void
|
info | ||||||||||||
info(text: string, detailedData?: string)
|
||||||||||||
A shorthand to display a simple info message.
Parameters :
Returns :
void
|
list |
list()
|
Returns all alerts.
Returns :
Alert[]
|
remove | ||||||
remove(alert: Alert)
|
||||||
Remove an alert from the current state.
Parameters :
Returns :
void
|
removeLastDanger |
removeLastDanger()
|
Removes last danger alert. It can be used e.g. in the case of a failed request which triggered an alert, to hide it from user.
Returns :
void
|
saveSuccess | ||||||||
saveSuccess(savedObject: string)
|
||||||||
Shorthand for a save successful alert.
Parameters :
Returns :
() => void
A function that can be executed to show the msg. |
success | ||||||||||||
success(text: string, detailedData?: string)
|
||||||||||||
A shorthand to display a simple success message.
Parameters :
Returns :
void
|
update | |||||||||
update(alert: Alert, fieldsToUpdate: Partial
|
|||||||||
Updates matching alert with provided values.
Parameters :
Returns :
void
|
warning | ||||||||||||
warning(text: string, detailedData?: string)
|
||||||||||||
A shorthand to display a simple warning message.
Parameters :
Returns :
void
|
state |
getstate()
|
Returns all alerts. |
Alert service provides methods for adding different types of alerts.
Simple methods for basic usage. Each method can be used with optional details parameter for showing details.
import { AlertService } from '@c8y/ngx-components';
(...)
constructor(protected alertService: AlertService) {}
(...)
showAlerts () {
// simple usage
this.alertService.success( 'Success message' );
this.alertService.danger( 'Danger message' );
this.alertService.info( 'Info message' );
this.alertService.warning( 'Warning message' );
this.alertService.addByText('danger', 'Danger message');
// alert with details
this.alertService.danger ( 'Error message', 'Details of error' );
}
Alert timeout property is responsible for hiding alert after defined (in milliseconds) time.
import { Alert, AlertService } from '@c8y/ngx-components';
(...)
constructor(protected alertService: AlertService) {}
(...)
showAlert () {
const alert: Alert = {
type: 'danger',
text: 'Danger message',
timeout: 5000 // Alert will disappear after 5 seconds
}
this.alertService.add( alert );
}
Alert text can be defined as HTML, allowHtml
property needs to be set as true.
import { Alert, AlertService } from '@c8y/ngx-components';
(...)
constructor(protected alertService: AlertService) {}
(...)
showAlert () {
const alert: Alert = {
type: 'danger',
text: '<div>My message</div>',
allowHtml: true
}
this.alertService.add( alert );
}
Alerts provide two callbacks:
import { Alert, AlertService } from '@c8y/ngx-components';
(...)
constructor(protected alertService: AlertService) {}
(...)
showAlert () {
const onDetailCallback = () => { console.log('On detail button clicked') };
const onCloseCallback = () => { console.log('On close button clicked') };
const alert: Alert = {
type: 'danger',
text: '<div>My message</div>',
onDetail: onDetailCallback,
onClose: onCloseCallback
}
this.alertService.add( alert );
}