Search code examples
javascriptangularjsangular-ui-grid

Angular Ui-Grid Conditional CellTemplate


I need to show a button in my ui-grid as long as the field value is NOT an empty string. I tried using ng-if but it is not working. Here is the code in my grid options:

  { field: 'ReleaseStatus', 
    width: 125, 
    displayName: 'Release Status', 
    cellTemplate: 
    '<div ng-if="row.entity.ReleaseStatus != """>
        <button id="editBtn" 
            type="button" 
            class="btn btn-default"  
            data-toggle="modal" 
            data-target="#myModal" 
            ng-click="grid.appScope.launch(row)">
            {{COL_FIELD}}
        </button>
    </div>'
   },

Without the ng-if the button displays and works great. However, because some records have an empty string for the field ReleaseStatus, the button should not appear.

Any assistance is greatly appreciated.


Solution

  • you should write it this way:

    '<div ng-if="row.entity.ReleaseStatus !== \'\'">'
    

    you can also put the ng-if directly on the buttom you are trying to hide.

    however be careful of using ng-if because it creates a new scope everytime.