Q:

If condition in angularjs for ng-grid

i am working on angularjs page. i have the following code.
columnDefs: [{field:'dt', displayName:'Date', width:'***', cellFilter:'date:\"dd-MMM-yyyy\"'}, 
                {field:'dt', displayName:'Time', width:'***', cellFilter:'date:\"HH:mm:ss\"'},                  
                {field:'rl', displayName:'Importance',width:'80px'}, 
                {field:'ev', displayName:'Event', width:'******'},                                              
                {field:'act', displayName:'Ac',width:'**'},
                {field:'fct', displayName:'Fc',width:'**'},
                {field:'fl', sortable:true, displayName:'Country', 
                      cellTemplate:'<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text><img class="flag" src="c:/Country_Images/1.jpg}"</img></span></div>',
                      width: '80px'},
                {field:'pre', displayName:'Pv',width:'**'}
                ]

I want to display an image (field: fl) from the project directory "C:/CountryImages" based on the value of rl. the values of rl are restricted to "H" "L" and "M". So, if the value of rl="H" then it should fetch C:/CountryImages/1.jpg and if rl="L" then fetch C:/CountryImages/3.jpg 
Thanks in advance :)

A:

Create a filter that does your mapping from rl value to image path, and apply that to your img ng-src binding expression, something like
{field:'fl', sortable:true, displayName:'Country', 
                      cellTemplate:'<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text><img class="flag" ng-src="row.getProperty(\'rl\') | imagefilter"</img></span></div>',
                      width: '80px'},

The filter would look like
angular.module('myApp')
 .filter('imagefilter', function() {
    return function(rl) { 
        if(rl==='L') return 'C:/CountryImages/3.jpg'
        //other mappings
   }
}

