Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
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