In my Angular application called myApp, I have a unique filter named myFilter. Additionally, I am utilizing UI Grid to display data in multiple grids such as myGrid1 and myGrid2. To streamline the process, I have organized column definitions for these grids within an Angular constant that can be accessed throughout the entire app.
However, I have encountered difficulty when attempting to apply myFilter as a cellFilter for specific column definitions stored in the constant. It seems that injecting a filter into a constant is not feasible, and even injecting the constant into a config() results in an "unknown provider" error.
Here is a snippet of the code structure:
angular.module('myApp', ['MyFilter'])
.constant('MyColumns', {
firstName: {
cellClass: 'myCellClass',
name: 'firstName'
},
lastName: {
cellClass: 'myCellClass',
// cellFiler: 'myFilter', // DOES NOT WORK
name: 'lastName'
}
// etc.
})
.filter('myFilter',
function() {
// Omitting filter functionality for brevity
return;
}
)
.controller('MyController',
function (MyColumns) {
var myData; // Omitting data for brevity
var myGrid1 = {
columnDefs: [
MyColumns.lastName,
MyColumns.firstName
// etc.
],
data: myData
// etc.
};
}
)
/*
.config(function (MyColumns) {
MyColumns.lastName.cellFilter = 'myFilter'; // DOES NOT WORK
})*/
;
Is there a way to successfully utilize myFilter on the column definitions stored in the constant? Any guidance would be greatly appreciated!
Versions: Angular 1.5.8, UI Grid 3.2.6