Skip to content

Instantly share code, notes, and snippets.

@khola
Created June 6, 2018 04:57
Show Gist options
  • Save khola/8b56bbe9fe911c383e03d20eb77241b7 to your computer and use it in GitHub Desktop.
Save khola/8b56bbe9fe911c383e03d20eb77241b7 to your computer and use it in GitHub Desktop.
import { Component, OnInit, ViewEncapsulation, Input, HostListener, EventEmitter, Output } from "@angular/core";
@Component({
selector: "custom-message",
template: `
<p [class]="type">
{{message}}
</p>
`,
styles: [
`p{display:block; padding:20px;background:#000; color:#fff; font-size:20px; font-family:inherit;}`,
`.success{background:rgb(65, 234, 212);}`,
`.failure{background:rgb(255, 32, 110);}`
],
encapsulation: ViewEncapsulation.Native
})
export class MessageComponent implements OnInit {
@Input() message: string = "test";
@Input() type: string = "";
@Output("action") action = new EventEmitter();
@HostListener("click")
onclick() {
this.action.emit("clicked");
}
constructor() {}
ngOnInit() {}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment