Question

我正在尝试在div上显示一个按钮，仅当div的ID在JSON对象内时才会显示。我想出了一个解决方案，但是我认为它很困难，因为它是硬编码的。我对angular还是比较陌生，因此如果有人可以提出替代解决方案（对此以及单击时元素本身的着色，因为它具有相同的硬编码问题），我将不胜感激

提供的stackblitz是问题的简化版本

https://stackblitz.com/edit/angular-ay8xem

Answer 1

我认为您正在寻找：（其余的对我来说很好，也许有人会提供更好的方法...）

  <div #yourDiv id="1" style="height: 100px;" [ngClass]="{'colored': color === 1}">
    <button id="abc" (click)="color = 1">WE WANT MORE BUTTONS HERE</button>
    <button *ngIf="hasReminder(yourDiv.id)">HiddenButton</button>
  </div>

Answer 2

如果将id存储在一个数组中并对该数组进行迭代，则至少可以轻松一点：

ids = ["1", "2", "3"];

HTML：

<div *ngFor="let id of ids">
  <div [id]="id" style="height: 100px;" [ngClass]="{'colored': color === id}">
    <button id="abc" (click)="color = id">WE WANT MORE BUTTONS HERE</button>
    <button *ngIf="hasReminder(id)">HiddenButton</button>
  </div>
</div>

您的 StackBlitz

但这可能是指令的正确位置，因此请注意以下内容：Official Docs

如何根据对象ID和div ID显示按钮

2 个答案: