Question

我有以下代码

<tbody *ngIf="packages">
              <tr *ngFor="let package of packages">
                <td class='checkbox'>
                  <label class="css-control css-control-primary css-checkbox table-select">
                    <input type="checkbox" class="css-control-input" (click)="selectPackage(package.name)"
                      [checked]="isSelected(package.name)">
                    <span class="css-control-indicator"></span>
                  </label>
                </td>
                <td> {{package.name}}</td>
                <td> {{package.version}}</td>
                <td> {{getNewMajorVersion(package.version)}}</td>
 <!-- <td (click)="createNewMajorVersion(package.name, package.version)"><i class="fa fa-plus-square"
                    aria-hidden="true"></i></td> -->
 <!-- <td><button ng-show = "{{(package.name).includes('_v')">UPGRADE</button></td> -->
      <td> {{(package.name).includes('_v') ? 'YES' : 'NO'}}</td>
     </tr>
</tbody>

基于第一列package.name，我想在最后一列显示按钮。该名称必须包含版本号（_v [0-9]）。目的是单击按钮并升级名称。

根据第一列，我可以显示YES或NO，但是显示按钮只是不想工作。就像您在代码中看到的那样，我将其注释掉了，但没有找到一个好的解决方案。

下面的行<td><button ng-show = "{{(package.name).includes('_v')">UPGRADE</button></td>还在每一行上显示按钮，不仅在他找到"_v"的地方？

有什么想法吗？

Answer 1

使用ng-show代替[style.display]

<td><button [style.display] = "package.name.includes('_v') ? 'block' : 'none'" >UPGRADE</button></td>

或者您可以尝试[隐藏]

<td><button [hidden] = "!package.name.includes('_v')" >UPGRADE</button></td>

在CSS中添加[hidden] { display: none !important;}

根据其他单元格在表格中显示按钮

1 个答案: