在Angular中的onclick方法中将变量作为参数传递

Question

我正在编写一个html，其中html将显示具有三个字段的记录列表-id，name和icon。当用户单击该图标时，将调用一个方法，其中将id作为参数传递，并将返回该记录的详细信息。我遵循的代码片段如下-

<tr *ngFor="let userDetail of userDetails">
                  <td>{{ userDetail.id }}</td>
                  <td>{{ userDetail.firstname }}  {{userDetail.lastname}}</td>
                  <td><a href="javascript:void(0);" (click) = "showUserDetails()" ><img src="/assets/user_details.png" width="20" height="20" /></a></td>
                </tr>

这里将创建showUserDetails（）函数时，需要传递userDetail.id。但是仍然无法传递参数。传递该参数的最佳方法是什么？预先感谢。

Answer 1

您必须确保：

1. 您正在将值传递给方法：(click) = "showUserDetails(userDetails.id)"

2. 该方法应在同一组件中声明，否则必须绑定例如在组件构造函数的公共变量中强制使用的服务。

我创建了一个简单的stackblitz project。可能会对您有所帮助。