Question

我是JavaScript和Angular的新手，我试图从单个按钮（单击）事件中获取json值。

我的代码如下：

HTML代码：

<button (click)="generatePdf(this.mockData)">Download PDF</button>

JSON代码：

public mockData = [
{
      "_id": 1,
      "heading": {
        "department_id": 1,
        "address_info": "123 Street",
        "date": "Mar 20, 2020"
      },
      "greeting": "Greetings!",
      "body": "This is a sample text",
      "closing": "Sincerely,",
      "signature": "John Doe"
    },
    {
      "_id": 2,
      "heading": {
        "department_id": 2,
        "address_info": "456 Street",
        "date": "Feb 20, 2020"
      },
      "greeting": "Good Day",
      "body": "This is a sample text",
      "closing": "Sincerely,",
      "signature": "Sarah Jane"
    }]

当前，我有一个html文件，其中所有数据均通过JSON值显示。我想做的是获取每个json值并将其链接到html文件中的每个按钮。任何帮助将不胜感激，谢谢！

Answer 1

尝试：

<div *ngFor="let data of mockData ">
    <button (click)="generatePdf(data)">Download PDF for {{data.signature}}</button>
</div>

以及组件代码中的

generatePdf(data){
    console.log(data)
}

注意：在处理HTML代码时，请勿使用this。 this用于访问ts文件中组件范围内的变量

从按钮切换json值（单击）

1 个答案: