Merge pull request #13022 from vvlladd28/bug/lwm2m/list-model/close-autocomplete

Fixed autocomplete not closing in LWM2M list model

ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.html

@@ -48,7 +48,7 @@
       </div>
       <ng-template #searchNotEmpty>
         <span>
-            {{ 'device-profile.lwm2m.no-objects-matching' | translate:{object: truncate.transform(searchText, true, 6, &apos;...&apos;)} }}
+            {{ 'device-profile.lwm2m.no-objects-matching' | translate:{object: (searchText | truncate: true: 6: &apos;...&apos;)} }}
         </span>
       </ng-template>
     </mat-option>

ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.ts

@@ -33,8 +33,8 @@ import { DeviceProfileService } from '@core/http/device-profile.service';
 import { Direction } from '@shared/models/page/sort-order';
 import { isDefined, isDefinedAndNotNull, isObject, isString } from '@core/utils';
 import { PageLink } from '@shared/models/page/page-link';
-import { TruncatePipe } from '@shared/pipe/truncate.pipe';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { MatAutocompleteTrigger } from '@angular/material/autocomplete';
 
 @Component({
   selector: 'tb-profile-lwm2m-object-list',
@@ -79,13 +79,12 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V
   @Output()
   removeList = new EventEmitter<any>();
 
-  @ViewChild('objectInput') objectInput: ElementRef<HTMLInputElement>;
+  @ViewChild('objectInput', {static: true}) objectInput: ElementRef<HTMLInputElement>;
+  @ViewChild('objectInput', {static: true, read: MatAutocompleteTrigger}) matAutocompleteTrigger: MatAutocompleteTrigger;
 
-  private propagateChange = (v: any) => {
-  }
+  private propagateChange: (value: any) => void = () => {};
 
-  constructor(public truncate: TruncatePipe,
-              private deviceProfileService: DeviceProfileService,
+  constructor(private deviceProfileService: DeviceProfileService,
               private fb: UntypedFormBuilder) {
     this.lwm2mListFormGroup = this.fb.group({
       objectsList: [this.objectsList],
@@ -113,7 +112,7 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V
     this.propagateChange = fn;
   }
 
-  registerOnTouched(fn: any): void {
+  registerOnTouched(_fn: any): void {
   }
 
   ngOnInit() {
@@ -140,6 +139,9 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V
       if (isDefined(this.objectInput)) {
         this.clear('', false);
       }
+      if (this.matAutocompleteTrigger.panelOpen) {
+        this.matAutocompleteTrigger.closePanel();
+      }
     } else {
       this.lwm2mListFormGroup.enable({emitEvent: false});
     }