CODEWITHSUNDEEP
angular-ui-grid
Kathir
Kathir

Reputation: 2903

How to bring a link or anchor tag in Json?

An example is populating a angular ui grid with json data and it working fine

plnkr.co/edit/xBvc4094CIu6oGDZXZx7?p=preview

However not sure how to have a download link or link for external source in one of the column in json.

example, download link with <a href....>Download Link</a>

In datatables, supports however how to provide the same in angular ui grid via json data.

Thanks.

Upvotes: 0

Views: 5279

Answers (1)

Sachet Gupta
Sachet Gupta

Reputation: 837

Use Cell Template cellTemplate to generate the column with hyperlink, and {{row.entity.link}} to fetch the link from JSON property (link is the property name in the sample JSON). Sample below.

columnDefs: [{
        name: 'FirstName'
      }, {
        name: 'LastName'
      }, {
        name: 'Job'
      }, {
        name: 'Hyperlink',
        cellTemplate: '<div>' +
          '  <a href="{{row.entity.link}}">Click me</a>' +
          '</div>'
      }],
data: [{
        "FirstName": "Sonny",
        "LastName": "Jayet",
        "Job": "Stack Overflow User",
        "link": "https://www.google.com"
      }, {
        "FirstName": "Tim",
        "LastName": "Harker",
        "Job": "Stack Overflow User",
        "link": "https://stackoverflow.com"
      }]

I hope this is what you are looking for, and this solves your problem.

Upvotes: 4

Related Questions