devextreme datagrid angular - вставьте значок в столбец поиска <dxi-column>

Question

>>>><<<< EDITED

как вставить значок в <dxo-lookup> столбец?

Это мой код, который работает, но я не знаю, как приступить к вставке значка

HTML

<dx-data-grid ......
   .....
   <dxi-column dataField="tipo" cellTemplate="cellTemplate">

      <dxo-lookup
           [dataSource]="typeColumsDataSource"
           valueExpr="id"
           displayExpr="descr">
      </dxo-lookup>
   </dxi-column>

   <div *dxTemplate="let data of 'cellTemplate'">
    <span class="dx-icon-home icon"></span> {{data.value}} {{data.text}}
  </div>

МАШИНОПИСЬ

this.typeColumsDataSource = {
          store: {
              type: 'array',
              data: [
                  { id: 0, descr: 'None' },
                  { id: 1, descr: 'Gift' },
                  { id: 2, descr: 'Request' },
                  { id: 3, descr: 'Gift/Request' },
              ],
              key: "id"
          }
      };

>>>><<<< EDITED

Теперь я вставил фиксированный значок в шаблон, мне нужно изменить значок в соответствии с data.value, Как я могу сделать?

Могу ли я вставить "если" в шаблоне? я могу вызвать метод в компоненте?

Answer 1

Вы можете настроить внешний вид колонки, следуя этому руководству.

в основном это идея необходимого кода:

onCellPrepared: function(e) {
            if(e.rowType === "data" && e.column.command === "edit") {
                var isEditing = e.row.isEditing,
                    $links = e.cellElement.find(".dx-link");

                $links.text("");

                if(isEditing){
                    $links.filter(".dx-link-save").addClass("dx-icon-save");
                    $links.filter(".dx-link-cancel").addClass("dx-icon-revert");
                } else {
                    $links.filter(".dx-link-edit").addClass("dx-icon-edit");
                    $links.filter(".dx-link-delete").addClass("dx-icon-trash");
                }
            }
        }