linktoDestination not working for pdfmake

Viewed 87

Currently I am using pdfmake to convert html to pdf and it's my first time using it.

I am trying to link Ashish, twitter, aaa to their particular section. I tried running the following code on playground but only for aaa its navigating to that section.

// playground requires you to assign document definition to a variable called dd

var dd = {
    content: [
    {
        "columns": [
            {
                "text": "",
                "priority": 0
            },
            {
                "stack": [
                    "2/17/2021, 2:41:01 PM",
                    {
                        "text": "AshishTemplate v4"
                    }
                ],
                "style": {
                    "alignment": "right"
                },
                "priority": 1
            }
        ]
    },
    {
        "text": "\n Table of Contents \n\n",
        "style": "header"
    },
    {
        "columns": [
            {
                "text": "Ashish",
                "width": "auto",
                "style": "tableOfContents",
                "linkToDestination": "Ashish1"
            },
            {
                "text": "Twitter",
                "width": "auto",
                "style": "tableOfContents",
                "linkToDestination": "Twitter1"
            },
            {
                "text": "aaa",
                "width": "auto",
                "style": "tableOfContents",
                "linkToDestination": "aaa"
            }
        ],
        "columnGap": 10
    },
    {
        "text": "Ashish",
        "style": "sectionHeader",
        "id": "Ashish1"
    },
    "",
    {
        "columns": [
            {
                "width": "100%",
                "text": ""
            }
        ]
    },
    {
        "text": "Twitter",
        "style": "sectionHeader",
        "id": "Twitter1"
    },
    "AShish",
    {
        "columns": [
            {
                "style": "listViewTable",
                "table": {
                    "widths": [
                        "50%",
                        "50%"
                    ],
                    "body": [
                        [
                            "Address",
                            "-"
                        ],
                        
                    ]
                },
                "layout": {
                    "defaultBorder": false
                }
            }
        ]
    },
    {
        "text": "aaa",
        "style": "sectionHeader",
        "id": "aaa"
    },
    "aa",
    {
        "columns": [
            {
                "width": "100%",
                "stack": []
            }
        ]
    }
]
}

What am I missing? Shouldn't Ashish and Twitter have a link to their particular section? My desired output for table of content is as follows:

Ashish Twitter aaa

and whenever user hovers over the text, the user should be able to click it and should be navigated to that section.

0 Answers
Related