当按下 URL 时，如何将 URL 单元格文本转换为小链接？

Question

如何在 angular 7 上的 URL 浏览器上打开单元格文本时将其转换为链接？

我在单元格显示 URL 内有列 offilneURL 文本的单元格文本作为文本

我需要转换文本或用链接替换文本，然后当按下它时直接重定向到 URL。

组件.html

<tbody>
<ng-container *ngFor="let repcon of ReportControl">
                  <ng-container *ngFor="let repdata of ReportData">
                    <tr *ngFor="let rep of reportdetailslist">

                      <td *ngFor="let coln of headerCols">


                        <span>


                          {{rep[coln]}}
                        </span>
                        <div *ngIf="coln==repcon.fieldName">
                          <div *ngIf="repcon.columnType==1">
                            display text as link url
                          </div>

                        </div>
                        </td>
                    </tr>
                  </ng-container>
                </ng-container>
</tbody>

样本数据

RevisionId   offilneURL
122345       https://source.z2data.com/2019/1/13/8/55/47/351/662203977/21527_SPCN.PDF
             display text as link url

高于我预期的数据的当前状态：

RevisionId   offilneURL
    122345       URL link

单击它时的小快捷方式名称将重定向到上面的链接 URL。 我需要制作为 URL 有两个原因：

首先，它占用太多空间。

其次，我可以直接点击链接，无需复制过去URL浏览器。

更新

通过 {{rep.offilneURL}} 在每个链接上访问 url

你能告诉我如何通过 {{rep.offilneURL}} 并打开为 url 并带有短名称描述

Answer 1

首先js中没有press origin事件，但是可以使用click事件来代替，比如dom.Click =function (e) {}。 可以在参数e中获取url文本，然后调用window.open(url)跳转