Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Custom Dropdown Component
import { Component, OnInit, forwardRef } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
@Component({
selector: 'app-custom-dropdown',
templateUrl: './custom-dropdown.component.html',
styleUrls: ['./custom-dropdown.component.scss'],
providers: [{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => CustomDropdownComponent),
multi: true,
}]
})
export class CustomDropdownComponent implements OnInit,
ControlValueAccessor {
options: string[];
selectedOption: string;
onChange: (_: any) => {};
constructor() { }
ngOnInit() {
this.options = [
'option 1',
'option 2',
'option 3',
];
this.selectedOption = this.options[0];
}
writeValue(value: string) {
this.selectedOption = value;
}
registerOnChange(fn: (_: any) => {}) {
this.onChange = fn;
}
changeSelectedOption(option: string) {
this.selectedOption = option;
this.onChange(option);
}
registerOnTouched() { }
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.