There are no errors in the console. Here is my full html and TypeScript code.

<h1>Pending Users</h1>
<div *ngIf="!localData; else usersPage">
    LOADING PENDING USERS
</div>
<ng-template #usersPage>
    <igx-grid #grid1 id="grid1" [data]="localData" [autoGenerate]="false" [paging]="false" (onCellSelection)="selectCell($event)" (onColumnInit)="initColumns($event)">
        <igx-column [sortable]="true" field="userName" header="User Name"></igx-column>
        <igx-column field="company" header="Company"></igx-column>
        <igx-column field="email" header="Email"></igx-column>
        <igx-column field="phone" header="Phone"></igx-column>
        <igx-column field="userName" header="Approve">
            <ng-template igxCell let-user="userName">
                <button igxButton igxRipple (click)="approveUser($event,user)">Approve</button>
            </ng-template>
        </igx-column>
    </igx-grid>
</ng-template>

import { Component, OnInit, ViewChild } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';

import { PendingUsersService } from './pending-users.service';
import { PendingUser } from './pending-user.model';
import { Observable } from "rxjs/Observable";

import { IgxGridComponent } from 'igniteui-angular/grid/grid.component';

@Component({
    moduleId: module.id,
    templateUrl: './pending-users.html'
})

export class PendingUsersComponent implements OnInit {
    
    public localData: PendingUser[];
    public test: string;
    @ViewChild('grid1') public grid1: IgxGridComponent;
    public selectedCell;
    constructor(private pendingUsersService: PendingUsersService) {
        this.test = "hello";
    }

    records: PendingUser[];

    private userGrid: string;

    public ngOnInit(): void {

        
        this.pendingUsersService.getPendingUsers().subscribe(records => this.localData = records);
    }

    public selectCell(event) {
        //this.selectedCell = event.cell;
        alert('select');
    }

    public initColumns(event) {
        //this works
        //alert('init');
    }


    public approveUser(event : PointerEvent, userName : string) {
        alert('Not Implemented.');
        //let cell = this.grid1.getCellByColumn(this.selectedCell.rowIndex, this.selectedCell.columnField);
        
    }

}

Hello Quan,

After further testing of this matter, it seems that within the igxCell context, if you're using custom let-* keyword, it's value could be set only to "cell" if you want to retrieve information from other grid cells on the current row. For example:

let-user="cell"

And after that you may access the corresponding row data through the 'user' object, which the cell object is assigned to, for example: user.row.rowData.userName.

Please try this and let me know if you need further assistance.

Regards,

Tsanna

Thank you! That worked!