Janet
Janet

Reputation: 1411

Conditional Cell Template in ui grid angular js

I need to display the text in a cell as a link based on a status or as a plain text. If the status is 'Deleted' the name should be displayed as plain text or else as an hyperlink. Below are my grid options. I am always getting it as hyperlink. Someone please help me correct my cell template so that I am getting it correct.

$scope.gridOptions = {
    data: 'ProjectDetails',
    columnDefs: [
    { field: 'Id', displayName: 'ID', visible: false },
    { displayName: 'Name', width: 200, cellTemplate: '<div> {{row.entity.ProjectStatus}} != Deleted </div>' ? '<div><a href="http://################ID={{row.entity.Id}}">{{row.entity.Name}}</a></div>' : '<div> {{row.entity.Status}}</div>' },
    { field: 'Expense', displayName: 'Operating Expense', width: 185, cellFilter: 'noFractionCurrency' },        
    { field: 'Status', displayName: 'Status', width: 150 }
    ]
};

Upvotes: 3

Views: 4971

Answers (3)

Kishor Velayutham
Kishor Velayutham

Reputation: 818

I just added href for Status -deleted and plain text for non-deleted option.

var cellTemplate: "<a target='_blank' ng-if="row.entity.Status !=\ 'Deleted\'" 
href='#########>{{row.entity.Name}}</a><div ng-
if="row.entity.Status == \'Deleted\'">{{row.entity.Name}}</div>"

Upvotes: 0

Janet
Janet

Reputation: 1411

ng-if helped me.

cellTemplate: "<a target='_blank' ng-if=\"row.entity.Status != 'Deleted'\" 
href='#########?ID={{row.entity.Id}}'>{{row.entity.Name}}</a><div ng-
if=\"row.entity.Status == 'Deleted'\">{{row.entity.Name}}</div>" 

Upvotes: 2

Kyle
Kyle

Reputation: 5557

I'd do this with ngShow.

var cellTemplate = "<div ng-show='row.entity.Status !== 'Deleted''><a href='#####{{row.entity.Id}}'>{{row.entity.Name}}</a></div><div ng-show='row.entity.Status === 'Deleted''>{{row.entity.Status}}</div>"

Upvotes: 0

Related Questions