從按鈕切換json值（單擊）

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文件中組件范圍內的變量