input component angular code example
Example 1: output event angular
@Component({...})
export class CounterComponent {
@Input()
count: number = 0;
@Output()
change: EventEmitter<number> = new EventEmitter<number>();
increment() {
this.count++;
this.change.emit(this.count);
}
decrement() {
this.count--;
this.change.emit(this.count);
}
}
Example 2: input property angular
<app-slider [title]="'This is a title'"> </app-slider>
.
.
@input() title: string;
constructor(){
}
<div id='slider' class='slider-big'>
<h1> {{title}}</h1>
</div>
Example 3: how to pass variable via component after it's updated angular
<app-child
[data]="data"
(filterEmmiter)="filter($event)">
</app-child>
import {Component, OnChanges, SimpleChanges, Input} from '@angular/core';
class Child implements OnInit, OnChanges {
@Input() Data: any;
constructor() {}
ngOnchanges(changes: SimpleChanges) {
console.log(changes);
}
}