sorting is not working for column which is having hyperlink on column data in ng2 smart table angular

Question

i have one column named "Link" is having link but sorting is not working for this column. please help

  data = [
{
  id: 1,
  name: 'Leanne Graham',
  username: 'Bret',
  link: '<a href="http://www.google.com">Google</a>',
},
{
  id: 2,
  name: 'Ervin Howell',
  username: 'Antonette',
  link: '<a href="https://github.com/akveo/ng2-admin">Ng2 Admin</a>',
}];

 settings = {
columns: {
  id: {
    title: 'ID',
   
  },
  name: {
    title: 'Full Name',
  
  },
  username: {
    title: 'User Name',
  },
  link: {
    title: 'Link',
    type: 'html',
  
  },
},

hyperlink example in ng2-smart-table

Answer 1

I'm not familiar with ng2-smart-table but my guess is that the sorting is using the entire link value for sorting, instead of the text displayed.

Regardless if that's the case or not, try looking at compareFunction:

link: {
  title: 'Link',
  type: 'html',
  
  compareFunction(direction: any, a: any, b: any) => {
    //gets the text in the link element
    let aText = $("<div></div>").html(a).find("a").text().toLowerCase();
    let bText = $("<div></div>").html(b).find("a").text().toLowerCase();

    if (aText < bText) {
      return -1 * direction;
    }
    if (aText > bText) {
      return direction;
    }
    return 0;
  }
}

Answer 2

maybe that could help you enter link description here