Posted 28 January 2019, 7:54 am EST
Exactly the same error appeared in a wjAutoComplete wrapper that I’m building for a project after updating to 5.20183.550. I’m attaching the code if it is useful:
HTML Code:
<label *ngIf="label"
class="svm-form-label"
[for]="input"
>
{{ label | translate}}
</label>
<wj-auto-complete
[id]="input"
[itemsSource]="items"
[delay]="200"
[isRequired]="true"
[isAnimated]="false"
[isDisabled]="isDisabled"
[isContentHtml]="true"
[isEditable]="false"
[minLength]="1"
[displayMemberPath]="'name'"
[(selectedItem)]="source.selectedItem"
[placeholder]="placeholder">
<ng-template wjItemTemplate let-item="item" let-itemIndex="itemIndex">
{{(descriptionAdapter === null) ?
((item.name === firstItemName || !showItemName) ? item.description : item.name + ' - ' + item.description) :
((item.name === firstItemName || !showItemName) ? descriptionAdapter(item) : item.name + ' - ' + descriptionAdapter(item))}}
</ng-template>
</wj-auto-complete>
TypeScript component:
import {AfterContentInit, Component, Input, OnDestroy, OnInit} from '@angular/core';
import {Item, ItemsSourceService} from '../../services/items-source/items-source.service';
import {Subscription} from 'rxjs/Subscription';
import * as _ from 'lodash';
@Component({
selector: 'svm-item-selector',
templateUrl: './svm-item-selector.html',
styleUrls: ['./svm-item-selector.scss']
})
export class SvmItemSelectorComponent implements OnInit, OnDestroy, AfterContentInit {
items: Item[];
@Input() label = '';
@Input() input = '';
@Input() placeholder = '';
@Input() source: ItemsSourceService<Item>;
@Input() sort = true;
@Input() sortBy = 'name';
@Input() sortFunction: (item: Item, item2: Item) => number = null;
@Input() firstItemDesc: string;
@Input() firstItemName = '';
@Input() tryToSelectItemName: string;
@Input() showItemName = true;
@Input() isDisabled = false;
@Input() descriptionAdapter: (item: Item) => string = null;
private _itemsSub: Subscription;
private _defaultSub: Subscription;
private _firstItem: Item;
private _tryToSelect = true;
private _delayedSelection: Item = undefined;
private _viewInit = false;
constructor() {
this.items = [];
}
ngOnInit() {
this._itemsSub = this.source.items.subscribe(objects => {
if (this.sort) {
if (this.sortFunction) {
objects.sort(this.sortFunction);
} else {
objects.sort((obj1, obj2) => obj1[this.sortBy].localeCompare(obj2[this.sortBy]));
}
}
this.addFirstItem(objects);
if (_.isEqual(this.items, objects)) { return; }
this.source.lastItems = objects;
if (objects.length > 0) {
this.items = objects;
if (!this.source.selectedItemSource) { // Do not select an item if there's a selected item source
let preSelectedItem = objects[0];
if (this.tryToSelectItemName && this._tryToSelect) {
const defItem = objects.find(obj => obj.name === this.tryToSelectItemName);
this._tryToSelect = false;
if (defItem) {
preSelectedItem = defItem;
}
}
if (this._viewInit) {
this.source.selectedItem = preSelectedItem;
} else {
this._delayedSelection = preSelectedItem;
}
}
} else {
this.items = objects;
if (this._viewInit) {
this.source.selectedItem = null;
} else {
this._delayedSelection = null;
}
}
}, (/* error */) => {
this.source.lastItems = null;
this.items = [];
if (this._viewInit) {
this.source.selectedItem = null;
} else {
this._delayedSelection = null;
}
});
if (this.source.selectedItemSource) {
this._defaultSub = this.source.selectedItemSource.subscribe(selItem => {
if (selItem) {
this.source.findAndSelectItem(item => item.name === selItem.name);
} else {
if (this.items.length > 0) {
this.source.selectedItem = this.items[0];
}
}
});
}
}
ngAfterContentInit(): void {
this._viewInit = true;
if (this._delayedSelection !== undefined) {
this.source.selectedItem = this._delayedSelection;
this._delayedSelection = undefined;
}
}
ngOnDestroy(): void {
if (this._itemsSub) { this._itemsSub.unsubscribe(); }
if (this._defaultSub) { this._defaultSub.unsubscribe(); }
}
private addFirstItem(objects: Item[]): void {
if (this.firstItemDesc !== undefined) {
if (this._firstItem === undefined) {
this._firstItem = {
name: this.firstItemName,
description: this.firstItemDesc
};
}
objects.unshift(this._firstItem);
}
}
}
