基于其他单元格在表中显示按钮

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，我想在最后一栏中显示一个按钮。名称必须包括，一个版本号(_v0-9)。其目的是单击按钮并升级名称。

我可以显示是或否取决于第一栏，但显示一个按钮只是不想工作。就像你在代码中看到的那样，我没有找到一个好的解决方案。

下面的行<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;}