如何使用Angular2根据某些条件使超链接不可点击到表的列答案

【问题标题】：How to make a hyperlink non clickable based on certain conditions to the column of a table using Angular2如何使用Angular2根据某些条件使超链接不可点击到表的列
【发布时间】：2017-06-23 11:04:04
【问题描述】：

我有一个包含 4 列的表 - 名称、id、部门、城市，并且我将行数据和列数据作为来自 typescript 文件的数组提供并通过 *ngFor 进行迭代。这是我的一段代码

<tbody>
   <tr *ngFor="let rowData of data | orderBy:convertSorting()">
       <td *ngFor="let column of columns; let idx=index">
            <span *ngIf="idx == 1 && someCondition">
                 <a href="your-target-url">{{rowData[column.columnValue] | format:column.filter}}</a>
            </span>
            <span *ngIf="idx != 1">
                {{rowData[column.columnValue] | format:column.filter}}
            </span>
       </td>
   </tr>
</tbody>

我提供了指向第二列所有行的超链接，即城市。如果“someCondition”为假，我想让这个不可点击。我该怎么做？

【问题讨论】：

标签： html angular hyperlink

【解决方案1】：

Angular2, what is the correct way to disable an anchor element?

a.disabled {
   pointer-events: none;
   cursor: not-allowed; 
}

<a [class.disabled]="!someCondition" href="your-target-url">

【讨论】：

这是禁用列的所有行，而不是列的特定行
不，不是。在someCondition 为假的地方禁用b。您需要细化 someCondition 的错误位置