DataTable - Templating Field data of a corresponding row is displayed as the cell content by default, this can be customized using templating. Similarly, custom content can be placed at the header and footer of a column with templating.
View on GitHub

export class DataTableTemplatingDemo implements OnInit {

    cars: Car[];
    msgs: Message[] = [];

    constructor(private carService: CarService) { }

    ngOnInit() {
        this.carService.getCarsSmall().then(cars => = cars);
    selectCar(car: Car) {
        this.msgs = [];
        this.msgs.push({severity:'info', summary:'Car Select', detail:'Vin: ' +});

View on GitHub

<p-growl [value]="msgs"></p-growl>

<p-dataTable [value]="cars">
    <p-column field="vin" header="Vin"></p-column>
    <p-column field="year" header="Year"></p-column>
    <p-column field="brand" header="Brand"></p-column>
    <p-column field="color" header="Color">
        <ng-template let-col let-car="rowData" pTemplate="body">
            <span [style.color]="car[col.field]">{{car[col.field]}}</span>
    <p-column styleClass="col-button">
        <ng-template pTemplate="header">
            <button type="button" pButton icon="fa-refresh"></button>
        <ng-template let-car="rowData" pTemplate="body">
            <button type="button" pButton (click)="selectCar(car)" icon="fa-search"></button>