【问题标题】:How to add a hyperlink in coiumn of dx-data-grid in Angular?如何在 Angular 的 dx-data-grid 的 coiumn 中添加超链接?
【发布时间】:2021-11-09 17:28:04
【问题描述】:

正在使用以下代码:

<dx-data-grid [dataSource]="openCasesdatasource" [showBorders]="true">
 <dxi-column dataField="Picture" cellTemplate="cellTemplate"></dxi-column>
 <div *dxTemplate="let data of 'cellTemplate'"><a [href]="data.url"></a></div>
</dx-data-grid>

这是需要显示的数据:

let abc: abc[] = [{
    "picture": "harry",
    "active": "true",
    "url": "https://google.com"}]

【问题讨论】:

    标签: angular devextreme devextreme-angular


    【解决方案1】:

    HTML

    <dx-data-grid
     [dataSource]="openCasesdatasource"
     [showBorders]="true"
     (onCellClick)="openPicture($event)">   
     <dxi-column dataField="Picture" cellTemplate="cellTemplate">
          <div *dxTemplate="let data of 'cellTemplate'">
                <img src="data.value">
          </div>
     </dxi-column>
    </dx-data-grid>
    

    TS

    openPicture(){
        if (e.rowType == "data" && e.column.dataField === "Picture") {
          if(e.value != null) {
            window.open(e.value, "_blank");
          }
        }
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-06-04
      • 1970-01-01
      • 2020-08-07
      • 1970-01-01
      • 2015-06-23
      • 1970-01-01
      • 1970-01-01
      • 2010-10-06
      相关资源
      最近更新 更多