argos/dmp-frontend/src/app/form/dynamic-fields/dynamic-field-autocomplete/autocomplete-remote.component.ts

import { Field } from '../../../models/Field';
import { Component, OnInit, Input, Output, EventEmitter, forwardRef, ViewEncapsulation } from '@angular/core';
import { ControlValueAccessor, FormControl, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
import { DatasetProfileService } from '../../../services/dataset-profile.service';
import { ActivatedRoute } from '@angular/router';
import { RequestItem } from '../../../models/criteria/RequestItem';
import { BaseCriteria } from '../../../models/criteria/BaseCriteria';
import { AutocompleteLookupItem } from '../../../models/auto-complete/AutocompleteLookupItem';
import { AutoCompleteConfiguration } from '../../../shared/components/auto-complete/AutoCompleteConfiguration';
declare var $: any;


@Component({
	selector: 'app-df-autocomplete',
	templateUrl: './autocomplete-remote.component.html',
	styleUrls: ['./autocomplete-remote.component.css'],
	encapsulation: ViewEncapsulation.None,
})
export class AutocompleteRemoteComponent implements OnInit/* , ControlValueAccessor */ {


	@Input() field: Field;
	@Input() disabled = false;
	@Input() form: FormGroup;

	public autoCompleteConfiguration: AutoCompleteConfiguration;
	public loading: boolean;
	public datasetId;
	public values: any[] = new Array();
	public typeaheadMS = 1400;

	constructor(private datasetProfileService: DatasetProfileService, route: ActivatedRoute) {
		this.datasetId = route.snapshot.params['id'];
	}


	ngOnInit() {
		const autocompleteRequestItem: RequestItem<AutocompleteLookupItem> = new RequestItem();
		autocompleteRequestItem.criteria = new AutocompleteLookupItem();
		autocompleteRequestItem.criteria.fieldID = this.field.id;
		autocompleteRequestItem.criteria.profileID = this.datasetId;
		this.autoCompleteConfiguration = new AutoCompleteConfiguration(this.datasetProfileService.queryAutocomplete.bind(this.datasetProfileService), autocompleteRequestItem);

	}

	displayWith(item: any) {
		if (!item) { return null; }
		if (typeof item === 'string') { item = this.transform(item); }
		return item['label'];
	}

	assign(item: any) {
		if (!item) { return null; }
		return this.transform(item);
	}

	transform(item: any) {
		if (typeof item === 'string') { return JSON.parse(item); } else { return JSON.stringify(item); }
	}
}