Finalized the autocomplete component

dmp-frontend/package-lock.json

@@ -673,6 +673,11 @@
         }
       }
     },
+    "angular2-uuid": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/angular2-uuid/-/angular2-uuid-1.1.1.tgz",
+      "integrity": "sha1-cvA81TK39AAy6x7PufhFc4S+lW4="
+    },
     "ansi-escapes": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-2.0.0.tgz",

dmp-frontend/package.json

@@ -28,6 +28,7 @@
     "angular2-datatable": "^0.6.0",
     "angular2-draggable": "^1.0.7",
     "angular2-number-picker": "^0.8.8",
+    "angular2-uuid": "^1.1.1",
     "bootstrap": "^3.3.7",
     "core-js": "^2.4.1",
     "flat": "^4.0.0",

dmp-frontend/src/app/app.component.html

@@ -66,9 +66,9 @@
           <!--
         -->
 
-
+<!--
         <autocomplete-remote [id]="'test-autocomplete'" [label]="'Please select smth'" [url]="'https://eestore.paas2.uninett.no/api/datarepo/'" ></autocomplete-remote>
-
+-->
       </div>
 
 </div>

dmp-frontend/src/app/form/fields/autocomplete-remote/autocomplete-remote.component.html

@@ -1,18 +1,5 @@
-<!--
 <div class="form-group">
-  selectedValue: {{selectedValue}} <br>
-  query: {{query}} <br>
-  <label for="{{id}}">{{label}}</label>
-  <select class="form-control" id="{{id}}" [ngModel]="selectedValue" (ngModelChange)="updateByQuery($event)" (change)="changed($event)">
-      <option *ngFor="let value of values; let i = index">{{value}}</option>
-    </select>
-</div>
--->
-
-<div class="form-group">
-  selectedValue: {{selectedValue}} <br>
-  query: {{query}} <br>
-  <label for="{{id}}">{{label}}</label>
+  <label *ngIf="label" for="{{id}}">{{label}}</label>
   <input auto-complete class="form-control" id="{{id}}" [ngModel]="selectedValue" (ngModelChange)="updateByQuery($event)" [source]="values" />
 </div>
 

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

@@ -1,6 +1,6 @@
 import { Component, OnInit,Input, Output, EventEmitter} from '@angular/core';
 import { ServerService } from '../../../services/server.service';
-
+import { UUID } from 'angular2-uuid';
 import { NguiAutoCompleteModule } from '@ngui/auto-complete';
 
 declare var $: any;
@@ -30,6 +30,8 @@ export class AutocompleteRemoteComponent implements OnInit {
   query : string = "";
 
   ngOnInit() {
+    if(this.id == null)
+      this.id = UUID.UUID();
     this.updateByQuery(this.query); //just to trigger the first call
   }