cc_snackbar_component.ts

import { Component, OnInit } from '@angular/core';
import { MdSnackBarRef } from '@angular/material'

@Component({
  selector: 'cc-snackbar',
  templateUrl: './snackbar.component.html',
  styles: [
    `md-icon{
    cursor: pointer;
    position: relative;
    top: 0px;
    margin-left: 10px;
    }

    .outer-container{
        position: relative;
        top: 0px;
        width: calc(100% + 30px);
        display: inline-block;
    }

    .message{
        width: calc(100% - 50px);
        display: inline-block;
    }

    .controls{
        width: 40px;
        display: inline-block;
        height: auto;
        margin-top: auto;
    }

    button{
        height: 25px;
        padding: 3px;
        line-height: 20px;
    }
`]
})
export class SnackbarComponent {  
  
  action: string;

  message: string;
  
  snackBarRef: MdSnackBarRef<SnackBarComponent>;

  constructor() { }
  ngOnInit() {
    
  }

  dismiss(){
    this.snackBarRef._action();
  }
  
  get hasAction(){
    return !!this.action;
  }
}