对象范围如何在指令之外的Angular中起作用

Question

我在Angular中有一个弹出窗口，用于删除确认。如何将对象传递给弹出窗口<div>。

示例代码：

<tr *ngFor="let **user** of users">
   <td style="text-align: -webkit-center;">
      <button (click)="showDeleteConfirm()">
         <span class="glyphicon glyphicon-trash"></span>Delete
      </button>
   </td>
</tr>

需要上述用户通过此处：

<div class="popupDelete">
   <popup #popupDelete (confirmClick)="ConfirmDelete(**user**)">
      Are you sure, you want to delete this user?
      <br>
   </popup>
</div>

Answer 1

由于popupDelete不是您tr的孩子，因此您需要使用控制器。

在您的HTML中，请注意参数showDeleteConfirm以及ConfirmDelete中缺少参数：

<tr *ngFor="let user of users">
   <td style="text-align: -webkit-center;">
                <button (click)="showDeleteConfirm(user)">
                <span class="glyphicon glyphicon-trash"></span>Delete
            </button>
            </td>
</tr>

<div class="popupDelete">
    <popup #popupDelete (confirmClick)="ConfirmDelete()">
        Are you sure, you want to delete this user?
        <br>
    </popup>

</div>

在你的TS中：

public showDeleteConfirm(user)
{
    this.userToDelete = user;
    ...
}

public ConfirmDelete()
{
   Database.Delete.This.User(this.userToDelete);
}

如果您的popupDelete是您tr的孩子，则可以传递ConfirmDelete与您user相同的*ngFor。你最终会得到多个popupDelete。