devexpress - devextream tag-box can we add custom row without checkbox in angular

Question

I am using angular 10 and devextream tag-box with checkbox, now I want to add custom div on top and bottom of the data row of the selection that will not checkbox any suggestion how can i achieve that.

 <div class="dx-field-value">
            <dx-tag-box
            [dataSource]="products"
            displayExpr="Name"
            valueExpr="Id"
            [showSelectionControls]="true"
            [maxDisplayedTags]="3"
            itemTemplate="item">
            <div *dxTemplate="let data of 'item'">
              
                <div style="display:inline-block">{{data.Name}}</div>
            </div>
        </dx-tag-box>
        </div>

question from:https://stackoverflow.com/questions/65881813/devextream-tag-box-can-we-add-custom-row-without-checkbox-in-angular

Answer 1

can you disable showSelectionControls and try:

 <div class="dx-field-value">
  <dx-tag-box
    [dataSource]="products"
    displayExpr="Name"
    valueExpr="Id"
    [showSelectionControls]="false"
    [maxDisplayedTags]="3"
    itemTemplate="item">
    <div *dxTemplate="let data of 'item'">
      <div>TOP</div>
      <div>{{data.Name}}</div>
      <div>BOTTOM</div>
    </div>
  </dx-tag-box>
</div>

TagBox - Customize Item Appearance