diff --git a/lib/core/form/components/widgets/people/people.widget.html b/lib/core/form/components/widgets/people/people.widget.html index bdd903e8f2..71356436a3 100644 --- a/lib/core/form/components/widgets/people/people.widget.html +++ b/lib/core/form/components/widgets/people/people.widget.html @@ -10,8 +10,7 @@ data-automation-id="adf-people-search-input" type="text" [id]="field.id" - [(ngModel)]="value" - [formControl] ="searchTerm" + [formControl]="searchTerm" placeholder="{{field.placeholder}}" [matAutocomplete]="auto"> diff --git a/lib/core/form/components/widgets/people/people.widget.ts b/lib/core/form/components/widgets/people/people.widget.ts index c54f766bfb..15e06ad3cc 100644 --- a/lib/core/form/components/widgets/people/people.widget.ts +++ b/lib/core/form/components/widgets/people/people.widget.ts @@ -70,7 +70,7 @@ export class PeopleWidgetComponent extends WidgetComponent implements OnInit { ); }), map((list: UserProcessModel[]) => { - let value = (this.input.nativeElement as HTMLInputElement).value; + let value = this.searchTerm.value; this.checkUserAndValidateForm(list, value); return list; }) @@ -83,7 +83,7 @@ export class PeopleWidgetComponent extends WidgetComponent implements OnInit { ngOnInit() { if (this.field) { - this.value = this.getDisplayName(this.field.value); + this.searchTerm.setValue(this.getDisplayName(this.field.value)); if (this.field.readOnly) { this.searchTerm.disable(); } @@ -97,7 +97,7 @@ export class PeopleWidgetComponent extends WidgetComponent implements OnInit { checkUserAndValidateForm(list, value) { const isValidUser = this.isValidUser(list, value); - if (isValidUser) { + if (isValidUser || value === '') { this.field.validationSummary.message = ''; this.field.validate(); this.field.form.validateForm(); @@ -131,7 +131,7 @@ export class PeopleWidgetComponent extends WidgetComponent implements OnInit { onItemSelect(item) { if (item) { this.field.value = item; - this.value = item; + this.searchTerm.setValue(item); } } }