how to add a button to smart table

how can i add a button in smart table. i found this link https://akveo.github.io/ng2-smart-table/#/examples/custom-editors-viewers where they integrated the button inside the cell, but i couldn’ find the code. i tried this code but it doesn’t work ` columns:

{ stat: { title: ‘stat’, type: ‘html’, valuePrepareFunction: (value) => { return <button nbButton>bouton</button>; } }, }`

[mohammad0omar]

Hey this is the link for the code

https://github.com/akveo/ng2-smart-table/blob/master/projects/demo/src/app/pages/examples/custom-edit-view/basic-example-button-view.component.ts

[mohammad0omar]

import { Component, OnInit, Input, Output, EventEmitter } from ‘@angular/core’; import { ViewCell } from ‘ng2-smart-table’;

@Component({ selector: ‘button-view’, template: <button (click)="onClickOne()">{{ renderValue }}</button> <button (click)="onClickTwo()">{{ renderValue }}</button> <button (click)="onClickThree()">{{ renderValue }}</button> , }) export class ButtonViewComponent implements ViewCell, OnInit { renderValue: string;

@Input() value: string | number; @Input() rowData: any;

@Output() clickOne: EventEmitter<any> = new EventEmitter(); @Output() clickTwo: EventEmitter<any> = new EventEmitter(); @Output() clickThree: EventEmitter<any> = new EventEmitter(); ngOnInit() { this.renderValue = this.value.toString().toUpperCase(); }

onClickOne() { this.clickOne.emit(this.rowData); } onClickTwo() { this.clickTwo.emit(this.rowData); } onClickThree() { this.clickThree.emit(this.rowData); } }

@Component({ selector: ‘basic-example-button-view’, template: <ng2-smart-table [settings]="settings" [source]="data"></ng2-smart-table> , }) export class BasicExampleButtonViewComponent implements OnInit {

settings = { columns: { id: { title: ‘ID’, }, name: { title: ‘Full Name’, }, username: { title: ‘User Name’, }, email: { title: ‘Email’, }, button: { title: ‘Button’, type: ‘custom’, renderComponent: ButtonViewComponent, onComponentInitFunction(instance) { instance.clickOne.subscribe(row => { alert(${row.name} saved!) }); instance.clickTwo.subscribe(row => { alert(${row.name} saved!) }); instance.clickThree.subscribe(row => { alert(${row.name} saved!) }); } }, }, };

data = [ { id: 1, name: ‘Leanne Graham’, username: ‘Bret’, email: ‘[e-mail]’, button: ‘Button #1’, }, { id: 2, name: ‘Ervin Howell’, username: ‘Antonette’, email: ‘[e-mail]’, button: ‘Button #2’, }, { id: 3, name: ‘Clementine Bauch’, username: ‘Samantha’, email: ‘[e-mail]’, button: ‘Button #3’, }, { id: 4, name: ‘Patricia Lebsack’, username: ‘Karianne’, email: ‘[e-mail]’, button: ‘Button #4’, }, { id: 5, name: ‘Chelsey Dietrich’, username: ‘Kamren’, email: ‘[e-mail]’, button: ‘Button #5’, }, ];

constructor() { }

ngOnInit() { }

}