CODEWITHSUNDEEP
angularjsng-grid
Acosta
Acosta

Reputation: 1055

Circular dependency Error when using a custom filter and filterOptions

first I got a Filter "fromMSDate" that I use to transform json dates not normal dates, if this filter is place then refresh my input that is bound to filterOptions.filterText I get 'Circular dependency' and 'Unknown provider: fromMSDate | dateFilterProvider <- fromMSDate '

//Module


var mainApp = angular.module('mainApp', ['ngGrid']);

//Controller


    mainApp.controller('MandateListController', function MandateListController($scope) {
        $scope.filterOptions = { filterText: '' };
        $scope.mandates = data;
        $scope.gridOptions = {
            data: "mandates",
            filterOptions: $scope.filterOptions,
            sortInfo: { fields: ['ExpectedDate', 'ProjectName'], directions: ['desc', 'asc'], columns: ['ExpectedDate', 'ProjectName'] },
            columnDefs: [
                { field: 'ProjectName', displayName: 'Project Name', width: '30%', cellClass: 'text-center' },
                { field: 'Amount', displayName: 'Size', cellFilter: 'number:2', cellClass: 'text-right' },
                { field: 'RatingId', displayName: 'Rating', cellClass: 'text-center' },
                { field: 'CurrencyId', displayName: 'Currency', cellClass: 'text-center' },
                { field: 'MaturityId', displayName: 'Maturity', cellClass: 'text-center' },
                { field: 'EstimatedPl', displayName: 'Estimated P/L', cellFilter: 'number:2', cellClass: 'text-right' },
                { field: 'ExpectedDate', displayName: 'Expected Date', cellClass: 'text-center', cellFilter: "fromMSDate | date:'mediumDate'" }
                    ]
           };
    });

//filter


    mainApp.filter("fromMSDate", [function () {
         var result = function(date, formatstring) {
              if (formatstring === null || formatstring === undefined) {
                  formatstring = "DD MMM YYYY";
              }

              return moment(date).format(formatstring);
         };

        return result;    
    }]);

Upvotes: 2

Views: 459

Answers (1)

GRaAL
GRaAL

Reputation: 626

If I correctly understand you somehow include into the HTML page the contents of $scope.gridOptions.columnDefs[].cellFilter. In the last columnDef you have the following filter:

fromMSDate | date:'mediumDate'

I think you expect that date will be passed as the first argument and 'mediumDate' as the second, but filters in angular.js has another syntax and you need to write this way:

date | fromMSDate:'mediumDate'

Filters are added to the expression with | character and get the prior expression as the first argument. Other arguments could be specified after :.

So in your example angular.js recognizes 'date' as filter name and fails to find DateFilter or DateFilterProvider for it.

Upvotes: 0

Related Questions