When I select a value from a dropdown, I want to pass it from the child component to the grandparent component. Depending on the selected option, I need to trigger a specific method in the theme config.
<select (change)="changedvalue($event)" class="selectionbox" [(ngModel)]="selectedValue" required>
<option value="1">red</option>
<option value="2">blue</option>
<option value="3">green</option>
<option value="4">Teaching</option>
<option value="5">Marketing</option>
</select>
changedvalue(event){
console.log(this.selectedValue);
this.formeService.testdata(this.selectedValue);
}
FormeService.ts
import {Injectable, Component, Directive, EventEmitter, Output} from '@angular/core';
@Injectable()
export class FormeService {
@Output() change = new EventEmitter<any>();
testdata(value) {
this.change.emit(value)
}
Grand parent component.ts
ngOnInit(): void {
this.formeService.change.subscribe((value)=> {
console.log(value);
if (value === 1) {
this.themeConfig.config();
} else if (value === 2) {
this.themeConfig.config2();
}
});
}