98 lines
1.9 KiB
TypeScript
98 lines
1.9 KiB
TypeScript
import { Component, OnInit,Input, Output, EventEmitter, forwardRef} from '@angular/core';
|
|
import { Validators, ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
|
|
import { ServerService } from '../../../services/server.service';
|
|
import { UUID } from 'angular2-uuid';
|
|
import { NguiAutoCompleteModule } from '@ngui/auto-complete';
|
|
|
|
declare var $: any;
|
|
|
|
|
|
@Component({
|
|
selector: 'autocomplete-remote',
|
|
templateUrl: './autocomplete-remote.component.html',
|
|
styleUrls: ['./autocomplete-remote.component.css'],
|
|
providers: [
|
|
{
|
|
provide: NG_VALUE_ACCESSOR,
|
|
useExisting: forwardRef(() => AutocompleteRemoteComponent),
|
|
multi: true
|
|
}
|
|
]
|
|
})
|
|
|
|
|
|
|
|
export class AutocompleteRemoteComponent implements OnInit, ControlValueAccessor {
|
|
|
|
|
|
id : string = UUID.UUID();
|
|
@Input() label : string;
|
|
@Input() url : string;
|
|
selectedValue : string;
|
|
|
|
|
|
values : any[] = new Array();
|
|
|
|
query : string = "";
|
|
|
|
|
|
constructor(private serverService :ServerService) {
|
|
|
|
}
|
|
|
|
|
|
ngOnInit() {
|
|
this.updateByQuery(this.query); //just to trigger the first call
|
|
}
|
|
|
|
|
|
|
|
updateByQuery(query : string){
|
|
this.serverService.getThroughProxy(this.url, query).subscribe(
|
|
response => {
|
|
this.values.length = 0; //clear array; -- this is quite a fast and memory efficient way
|
|
response.data.forEach(element => {
|
|
this.values.push(element.attributes.name);
|
|
});
|
|
},
|
|
error => {
|
|
console.log(error);
|
|
}
|
|
);
|
|
}
|
|
|
|
|
|
onChange: any = () => { };
|
|
onTouched: any = () => { };
|
|
|
|
get value() {
|
|
this.value = this.selectedValue;
|
|
return this.selectedValue;
|
|
}
|
|
|
|
set value(val) {
|
|
this.selectedValue = val;
|
|
this.onChange(val);
|
|
this.onTouched();
|
|
}
|
|
|
|
|
|
|
|
registerOnChange(fn) {
|
|
this.onChange = fn;
|
|
}
|
|
|
|
registerOnTouched(fn) {
|
|
this.onTouched = fn;
|
|
}
|
|
|
|
writeValue(value) {
|
|
if (value) {
|
|
this.value = value;
|
|
}
|
|
}
|
|
|
|
}
|
|
|