diff --git a/cypress/integration/alerts_page_spec.ts b/cypress/integration/alerts_page_spec.ts
index 78580883ad..b9d3fb8563 100644
--- a/cypress/integration/alerts_page_spec.ts
+++ b/cypress/integration/alerts_page_spec.ts
@@ -72,9 +72,10 @@ describe('Alerts page test suite', () => {
});
it('alerts in dismissible example can all be closed and then resetting to default state', () => {
- cy.get(alertsDemos[3]).find('alert').as('dismissAlert').each(($alert, i) => {
- cy.get('@dismissAlert').eq(i).find('.close').click();
+ cy.get(alertsDemos[3]).find('alert').as('dismissAlert').each(($alert) => {
+ $alert.find('.close').click();
});
+
cy.get('@dismissAlert')
.should('not.to.have.descendants', 'div');
diff --git a/demo/src/app/components/+alerts/demos/dismiss-on-timeout/dismiss-on-timeout.html b/demo/src/app/components/+alerts/demos/dismiss-on-timeout/dismiss-on-timeout.html
index 591b19e124..477170d4bd 100644
--- a/demo/src/app/components/+alerts/demos/dismiss-on-timeout/dismiss-on-timeout.html
+++ b/demo/src/app/components/+alerts/demos/dismiss-on-timeout/dismiss-on-timeout.html
@@ -1,9 +1,5 @@
-
- Well done! You successfully read this important alert message.
-
-
-
If you missed alert on top of me, just press Add more
button
+If you missed alert under me, just press Add more
button
-
{{ alert.msg }}
+
{{ alert.msg }}
diff --git a/demo/src/app/components/+alerts/demos/dismiss-on-timeout/dismiss-on-timeout.ts b/demo/src/app/components/+alerts/demos/dismiss-on-timeout/dismiss-on-timeout.ts
index 61a47fd960..5cb637e7c3 100644
--- a/demo/src/app/components/+alerts/demos/dismiss-on-timeout/dismiss-on-timeout.ts
+++ b/demo/src/app/components/+alerts/demos/dismiss-on-timeout/dismiss-on-timeout.ts
@@ -1,11 +1,16 @@
import { Component } from '@angular/core';
+import { AlertComponent } from 'ngx-bootstrap/alert/alert.component';
@Component({
selector: 'demo-alert-timeout',
templateUrl: './dismiss-on-timeout.html'
})
export class DemoAlertTimeoutComponent {
- alerts: any = [];
+ alerts: any[] = [{
+ type: 'success',
+ msg: `Well done! You successfully read this important alert message. (added: ${new Date().toLocaleTimeString()})`,
+ timeout: 5000
+ }];
add(): void {
this.alerts.push({
@@ -14,4 +19,8 @@ export class DemoAlertTimeoutComponent {
timeout: 5000
});
}
+
+ onClosed(dismissedAlert: AlertComponent): void {
+ this.alerts = this.alerts.filter(alert => alert !== dismissedAlert);
+ }
}
diff --git a/demo/src/app/components/+alerts/demos/dismiss/dismiss.html b/demo/src/app/components/+alerts/demos/dismiss/dismiss.html
index 73df778db9..7cfcd6d5d9 100644
--- a/demo/src/app/components/+alerts/demos/dismiss/dismiss.html
+++ b/demo/src/app/components/+alerts/demos/dismiss/dismiss.html
@@ -1,5 +1,5 @@
-
{{ alert.msg }}
+
{{ alert.msg }}
diff --git a/demo/src/app/components/+alerts/demos/dismiss/dismiss.ts b/demo/src/app/components/+alerts/demos/dismiss/dismiss.ts
index fea0483d77..20b5db1fe0 100644
--- a/demo/src/app/components/+alerts/demos/dismiss/dismiss.ts
+++ b/demo/src/app/components/+alerts/demos/dismiss/dismiss.ts
@@ -6,7 +6,7 @@ import { Component } from '@angular/core';
})
export class DemoAlertDismissComponent {
dismissible = true;
- alerts: any = [
+ defaultAlerts: any[] = [
{
type: 'success',
msg: `You successfully read this important alert message.`
@@ -20,8 +20,13 @@ export class DemoAlertDismissComponent {
msg: `Better check yourself, you're not looking too good.`
}
];
+ alerts = this.defaultAlerts;
reset(): void {
- this.alerts = this.alerts.map((alert: any) => Object.assign({}, alert));
+ this.alerts = this.defaultAlerts;
+ }
+
+ onClosed(dismissedAlert: any): void {
+ this.alerts = this.alerts.filter(alert => alert !== dismissedAlert);
}
}
diff --git a/src/alert/alert.component.ts b/src/alert/alert.component.ts
index 3b22924f51..13a32e73c4 100644
--- a/src/alert/alert.component.ts
+++ b/src/alert/alert.component.ts
@@ -1,5 +1,10 @@
import {
- ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnInit,
+ ChangeDetectionStrategy,
+ ChangeDetectorRef,
+ Component,
+ EventEmitter,
+ Input,
+ OnInit,
Output
} from '@angular/core';
import { AlertConfig } from './alert.config';
@@ -33,7 +38,7 @@ export class AlertComponent implements OnInit {
classes = '';
- dismissibleChange: EventEmitter = new EventEmitter();
+ dismissibleChange = new EventEmitter();
constructor(_config: AlertConfig, private changeDetection: ChangeDetectorRef) {
Object.assign(this, _config);