Блог

У меня есть lt;dx-drop-down-boxgt; HTML-элемент, который я хочу использовать для получения списка клиентов и отображения их в поле с использованием определенного выражения. Список передается из базы данных SQL в модель представления. Вот соответствующие фрагменты:

component.html

 lt;dx-form id="customerform" [(formData)]="customer" cssClass="form-group" [colCount]="2"gt;  lt;dxi-item itemType="group" caption="Customer" cssClass="first-group"gt;  lt;dx-drop-down-box  [(value)]="gridBoxValue"  [(opened)]="isGridBoxOpened"  valueExpr="customerId"    [deferRendering]="false"  [displayExpr]="gridBox_displayExpr"  placeholder="Choose a customer..."  [showClearButton]="true"  [dataSource]="gridDataSource"  (onOptionChanged)="onGridBoxOptionChanged($event)"  (onOpened)="onCustomerDropDownOpen($event)"  [dropDownOptions]="{ width: 'auto' }"     gt;  lt;div *dxTemplate="let data of 'content'"gt;  lt;dx-data-grid  [dataSource]="gridDataSource"  [hoverStateEnabled]="true"  [(selectedRowKeys)]="gridBoxValue"  [columnAutoWidth]="true"  gt;  lt;dxo-selection mode="single"gt;lt;/dxo-selectiongt;  lt;dxo-filter-row [visible]="true"gt;lt;/dxo-filter-rowgt;  lt;dxo-scrolling mode="virtual"gt;lt;/dxo-scrollinggt;  lt;dxo-paging [enabled]="true" [pageSize]="10"gt;lt;/dxo-paginggt;  lt;dxo-editing mode="cell" [allowUpdating]="false" [allowAdding]="false" [allowDeleting]="false"gt;lt;/dxo-editinggt;    lt;dxi-column dataField="firstName" caption="Όνομα" gt;lt;/dxi-columngt;   lt;dxi-column dataField="lastName" caption="Επίθετο"gt;lt;/dxi-columngt;   lt;dxi-column dataField="phone" caption="Τηλέφωνο"gt;lt;/dxi-columngt;   lt;dxi-column dataField="code" caption="Κωδικός"gt;lt;/dxi-columngt;   lt;dxi-column dataField="customerId" [visible]="false"gt;lt;/dxi-columngt;  lt;/dx-data-gridgt;  lt;/divgt;  lt;/dx-drop-down-boxgt;  lt;/dxi-itemgt;  lt;/dx-formgt;   

Выражение отображения

 gridBox_displayExpr(item) {  console.log("Logging item..."   item);  return item amp;amp; item.lastName   ' '   item.firstName   ' lt;'   item.phone   'gt;';  }  

После некоторой отладки в браузере я обнаружил, что item аргумент in gridBox_displayExpr() выводится undefined , как только обнаруживается изменение. Данные клиента правильно загружаются с серверной части, и я могу назначить их объекту DTO, который я вижу в отладчике. Это только пользовательский интерфейс, который не согласуется с тем, что я делаю.

Еще один маркер, который я использую для проверки правильности перемещения данных, — это OnGridBoxOptionChanged функция, которая срабатывает, как только я нажимаю на новое имя. Событие, полученное из HTML-кода, правильно отображает как предыдущее значение, так и новое имя, которое я выбрал, но поле по-прежнему [object Object] является допустимым именем. Кстати, gridDataSource реализует модель представления с customerId числовым полем.

У вас есть какие-нибудь идеи, что может быть не так?