如何使用 *ngFor+angular4 将相应的行数据传递给组件

Question

我有 html 如下所示。需要帮忙。我不擅长Angular。

<tbody>       
        <tr  *ngFor="let data of employeeFilterLists">
            <td>{{data.Code}}</td>
            <td (click)="selectEmployee('{{data.Code}}')">{{data.FirstName}} {{data.LastName}}</td>
            <td>{{data.Salary}}</td>
        </tr>       
</tbody>

现在，我已经编写了组件方法来捕获值以从方法调用另一个组件。

selectEmployee(mdData:string){
  console.log("Choose Model...."+ mdData);
}

我遇到了以下错误。

Uncaught Error: Template parse errors:
Parser Error: Got interpolation ({{}}) where expression was expected at column 16 in [selectEmployee('{{data.Code}}')] in ng:///AppModule/EmployeeComponent.html@16:16 ("  <tr  *ngFor="let data of employeeFilterLists">
            <td>{{data.Code}}</td>
            <td [ERROR ->](click)="selectEmployee('{{data.Code}}')">{{data.FirstName}} {{data.LastName}}</td>
            <td>{"): ng:///AppModule/EmployeeComponent.html@16:16
Parser Error: Got interpolation ({{}}) where expression was expected at column 16 in [selectEmployee('{{data.Code}}')] in ng:///AppModule/EmployeeComponent.html@16:16 ("ists">
            <td>{{data.Code}}</td>
            <td (click)="selectEmployee('{{data.Code}}')">[ERROR ->]{{data.FirstName}} {{data.LastName}}</td>
            <td>{{data.Salary}}</td>
        </tr>
"): ng:///AppModule/EmployeeComponent.html@16:58
Parser Error: Got interpolation ({{}}) where expression was expected at column 16 in [selectEmployee('{{data.Code}}')] in ng:///AppModule/EmployeeComponent.html@16:16 ("(click)="selectEmployee('{{data.Code}}')">{{data.FirstName}} {{data.LastName}}</td>
            <td>[ERROR ->]{{data.Salary}}</td>
        </tr>

"): ng:///AppModule/EmployeeComponent.html@17:16

Answer 1

您应该删除 selectEmployee 方法中的 {{}}，

事情是这样的：

<td (click)="selectEmployee(data.Code)">{{data.FirstName}} {{data.LastName}}</td>

希望对您有所帮助！

如何使用 *ngFor+angular4 将相应的行数据传递给组件

How to pass respective row data to component using *ngFor+angular4

ngfor

angular