How to update ng2-smart-table's custom part dynamically ?

Question

In my angular 6 app, I have used ng2-smart-table. Now I need to show and hide custom action features based on their access rights.

I'm able to mange add, edir and delete part. With that I have also put some custom icons also for extra features.

custom: [            
  { name: 'up', title: '<img src="/pathOfIcon" class="tableIcon up-arrow-true-icon">' },
  { name: 'up-cancel', title: '<img src="/pathOfIcon" class="tableIcon up-arrow-cancel-icon">' },
  { name: 'down', title: '<img src="/pathOfIcon" class="tableIcon down-arrow-true-icon">' },
  { name: 'down-cancel', title: '<img src="/pathOfIcon" class="tableIcon down-arrow-cancel-icon">' },
]

Now I need to manage this thing based on access.

So how could I enable and disable this icons.

Note: I can apply css on each row and then hide icon, But I need to do once not on each row.

Answer 1

You can add icons while add a icons in custom array...

Try this way

if(access){     // Set you access condition
     this.settings.custom.push('{ name: 'up', title: '<img src="/pathOfIcon" class="tableIcon up-arrow-true-icon">' }');
     this.settings.custom.push('{ name: 'up-cancel', title: '<img src="/pathOfIcon" class="tableIcon up-arrow-cancel-icon">' },');
}else{
    this.settings.custom.push(' { name: 'down', title: '<img src="/pathOfIcon" class="tableIcon down-arrow-true-icon">' }');
    this.settings.custom.push('{ name: 'down-cancel', title: '<img src="/pathOfIcon" class="tableIcon down-arrow-cancel-icon">' }');
}  

This the simple way to add icons... Because custom is array so you can push icons in that...

Hope this may help you... :)