\ No newline at end of file
diff --git a/src/demo-app/snack-bar/snack-bar-demo.ts b/src/demo-app/snack-bar/snack-bar-demo.ts
index 72a8710984c6..c19d9044464b 100644
--- a/src/demo-app/snack-bar/snack-bar-demo.ts
+++ b/src/demo-app/snack-bar/snack-bar-demo.ts
@@ -10,13 +10,19 @@ export class SnackBarDemo {
message: string = 'Snack Bar opened.';
actionButtonLabel: string = 'Retry';
action: boolean = false;
+ autoHide: boolean = false;
+ autoHideMs: number | boolean;
constructor(
public snackBar: MdSnackBar,
public viewContainerRef: ViewContainerRef) { }
open() {
- let config = new MdSnackBarConfig(this.viewContainerRef);
+ let autoHide: number | boolean = false;
+ if (this.autoHide) {
+ autoHide = this.autoHideMs;
+ }
+ let config = new MdSnackBarConfig(this.viewContainerRef, autoHide);
this.snackBar.open(this.message, this.action && this.actionButtonLabel, config);
}
}
diff --git a/src/lib/snack-bar/README.md b/src/lib/snack-bar/README.md
index 96f39ce98467..d5369e8a0986 100644
--- a/src/lib/snack-bar/README.md
+++ b/src/lib/snack-bar/README.md
@@ -15,7 +15,7 @@
| `viewContainerRef: ViewContainerRef` | The view container ref to attach the snack bar to. |
| `role: AriaLivePoliteness = 'assertive'` | The politeness level to announce the snack bar with. |
| `announcementMessage: string` | The message to announce with the snack bar. |
-
+| `autoHideDuration: number | boolean` | The number of milliseconds to wait before automatically dismissing. If no value is specified the snackbar will dismiss normally. |
### Example
The service can be injected in a component.
@@ -30,7 +30,8 @@ export class MyComponent {
viewContainerRef: ViewContainerRef) {}
failedAttempt() {
- config = new MdSnackBarConfig(this.viewContainerRef);
+ // This snackbar will dissmiss after 3s (3000ms)
+ config = new MdSnackBarConfig(this.viewContainerRef, 3000);
this.snackBar.open('It didn\'t quite work!', 'Try Again', config);
}
diff --git a/src/lib/snack-bar/snack-bar-config.ts b/src/lib/snack-bar/snack-bar-config.ts
index 8eaebb8202cc..a8b28721e4ff 100644
--- a/src/lib/snack-bar/snack-bar-config.ts
+++ b/src/lib/snack-bar/snack-bar-config.ts
@@ -12,7 +12,16 @@ export class MdSnackBarConfig {
/** The view container to place the overlay for the snack bar into. */
viewContainerRef: ViewContainerRef;
- constructor(viewContainerRef: ViewContainerRef) {
+ /*
+ * The number of milliseconds to wait before automatically dismissing.
+ * If no value is specified the snackbar will dismiss normally.
+ * If a value is provided the snackbar can still be dismissed normally.
+ * If a snackbar is dismissed before the timer expires, the timer will be cleared.
+ */
+ autoHideDuration: number | boolean;
+
+ constructor(viewContainerRef: ViewContainerRef, autoHideDuration: number | boolean = false) {
this.viewContainerRef = viewContainerRef;
+ this.autoHideDuration = autoHideDuration;
}
}
diff --git a/src/lib/snack-bar/snack-bar-ref.ts b/src/lib/snack-bar/snack-bar-ref.ts
index 5b088df78c4f..a24385c88a8c 100644
--- a/src/lib/snack-bar/snack-bar-ref.ts
+++ b/src/lib/snack-bar/snack-bar-ref.ts
@@ -19,6 +19,8 @@ export class MdSnackBarRef {
/** Subject for notifying the user that the snack bar has closed. */
private _afterClosed: Subject = new Subject();
+ autoHide: number;
+
constructor(instance: T,
containerInstance: MdSnackBarContainer,
private _overlayRef: OverlayRef) {
@@ -36,6 +38,10 @@ export class MdSnackBarRef {
this._afterClosed.complete();
});
}
+ // Clear autohide interval
+ if (this.autoHide) {
+ clearInterval(this.autoHide);
+ }
}
/** Gets an observable that is notified when the snack bar is finished closing. */
diff --git a/src/lib/snack-bar/snack-bar.ts b/src/lib/snack-bar/snack-bar.ts
index e2f2c5003c4a..ed469b6a4fb7 100644
--- a/src/lib/snack-bar/snack-bar.ts
+++ b/src/lib/snack-bar/snack-bar.ts
@@ -21,8 +21,6 @@ import {MdSnackBarRef} from './snack-bar-ref';
import {MdSnackBarContainer} from './snack-bar-container';
import {SimpleSnackBar} from './simple-snack-bar';
-// TODO(josephperrott): Automate dismiss after timeout.
-
/**
* Service to dispatch Material Design snack bar messages.
@@ -56,6 +54,12 @@ export class MdSnackBar {
} else {
mdSnackBarRef.containerInstance.enter();
}
+ // Auto dismiss after timeout.
+ if (config.autoHideDuration) {
+ mdSnackBarRef.autoHide = setTimeout(() => {
+ mdSnackBarRef.dismiss();
+ }, config.autoHideDuration);
+ }
this._live.announce(config.announcementMessage, config.politeness);
this._snackBarRef = mdSnackBarRef;
return this._snackBarRef;