如何创建 Angular 网格列单元格超链接？

Question

我有 angular 网格，我想创建一个 link 列单元格，其动态作业 ID 类似于这样 /jobs/3/job-maintenance/general - 这里 3 是作业 ID。假设我 element.jobId 有空。我该怎么做？

这是现有的列代码-

<ng-container cdkColumnDef="jobName">
   <th cdk-header-cell *cdkHeaderCellDef>
      <span class="cursor-pointer" (click)="doSort('jobName')">Job Name</span>
      <span *ngIf="sortKey === 'jobName'"> {{ sortDirection === 'asc' ? '↑' : '↓' }} 
      </span>
   </th>
   <td cdk-cell *cdkCellDef="let element">
      <u *ngIf="!hasContainedName(element.jobName); else contain"
         class="text-primary cursor-pointer">{{element.jobName}}</u>
      <ng-template #contain>{{element.jobName}}</ng-template>
   </td>
</ng-container>

Answer 1

感谢 comments/help。这是按照我想要的方式正确工作的解决方案。

<ng-container cdkColumnDef="jobName">
                <th cdk-header-cell *cdkHeaderCellDef>
                  <span class="cursor-pointer" (click)="doSort('jobName')">Job Name</span>
                  <span *ngIf="sortKey === 'jobName'"> {{ sortDirection === 'asc' ? '↑' : '↓' }}</span>
                </th>
                <td cdk-cell *cdkCellDef="let element">
                  <u *ngIf="!hasContainedName(element.jobName); else contain"
                     class="text-primary cursor-pointer"><a href="/#/jobs/{{element.jobId}}/job-maintenance/general">{{element.jobName}}</a></u>
                   <ng-template #contain >{{element.jobName}}</ng-template>
                </td>
              </ng-container>

如何创建 Angular 网格列单元格超链接？

How can I create Angular Grid column cell hyperlink?

javascript

hyperlink

typescript

angular-ui-router

angular