How to put a link to a specific column

[YuTung]

The table is working, but I want one column to have links. How to do that? Thanks.

[mbtakanov]

I did it like this:

private columnsForTable: Array<any> = [
{ prop1: 1, prop2: 2, prop3: '<a href="https://www.google.com">Link</a>'},
...
];

[Sam2243]

@mbtakanov Is it possible to iterate over rows in html? I know for the fact that if you use [rows]="rows" then it will be populated but If i want to iterate over then how is it possible? The following I am doing but it doesn't work

<ng-table [config]="config" [columns]="columns">

            <tr *ngFor="let row of rows">
                <td>1</td>
                <td>{{ row.eid }}</td>
                <td>{{ row.rankValue }}</td>
                <td>{{ row.reason.similarilty }}</td>
            </tr>
        </ng-table>  

[arinhere]

Is there any way to use routerlink, or even a click event in stead of href? as href will refresh the whole page, which is not expected for angular

[mbtakanov]

@Sam2243 Why you need to iterate over the rows in the html? What you aim for? @arinhere Yes, you can use routerLink=['/foo/123']. I've used the following:

// JS
public onCellClick(data: any): any {
    if (data.column === 'edit') {
        this.router.navigate(['/foo/', data.row.id]);
    }
}

<!--HTML-->
<ng-table [config]="config"
          (tableChanged)="onChangeTable(config)"
          (cellClicked)="onCellClick($event)"
          [rows]="rows" [columns]="columns">

// JS data object
let rows = [
{'id': 127314, 'edit': '<div>Edit</div>', ... ,},
 ...
]

This is in case you have edit as a property in your column and row arrays and id as a row property in your row array.

[levibautista]

@mbtakanov I tried your solutions on the column but it's just showing text instead a href link