diff --git a/sharedComponents/input/input.component.ts b/sharedComponents/input/input.component.ts index b48a268c..74f989c9 100644 --- a/sharedComponents/input/input.component.ts +++ b/sharedComponents/input/input.component.ts @@ -52,6 +52,21 @@ export interface Option { + +
+ + + + {{option}} + + +
+
; public searchControl: FormControl; private subscriptions: any[] = []; + /** Autocomplete */ + @Input() + public autocompleteList: string[] = []; + public autocompleteFilteredList: Observable; @ViewChild('select') select: MatSelect; @ViewChild('searchInput') searchInput: ElementRef; focused: boolean = false; @@ -218,6 +237,11 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges { this.filteredOptions = this.searchControl.valueChanges.pipe(startWith(''), map(option => this.filter(option))); } + if(this.autocompleteList && this.type === 'autocomplete') { + this.autocompleteFilteredList = of(this.autocompleteList); + this.autocompleteFilteredList = this.formControl.valueChanges.pipe(startWith(''), + map(value => this.simpleFilter(value))); + } if (this.formControl && this.formControl.validator) { let validator = this.formControl.validator({} as AbstractControl); this.required = (validator && validator.required); @@ -285,6 +309,11 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges { return options.filter(option => option.label.toLowerCase().indexOf(filterValue) != -1); } + private simpleFilter(value: string): string[] { + const filterValue = value.toLowerCase(); + return this.autocompleteList.filter(option => option.toLowerCase().includes(filterValue)); + } + add(event: MatChipInputEvent) { if (this.addExtraChips && event.value) { this.stopPropagation();