No provider for FilterService on Kendo Grid in Custom Container when using angular 4

Question

I wrote a little wrapper, which wraps a Kendo Grid inside a custom control. It looks like this:

 <imx-grid [dataSource]="myTasks">
        <kendo-grid-column field="Task" title="Task">
                <ng-template kendoGridHeaderTemplate let-column>
                        versuch
                        <imx_stringFilter column="column" style="display:inline-block;" textField="Task" DisplayValue="versuch" valueField="Task">
                        </imx_stringFilter>
                    </ng-template>                        
        </kendo-grid-column>
     ...

The template for imx-grid only contains the kendo grid with some predefined values, that should be used on any grid.

Which should result in this image: Preview

But instead I got a "No provider for FilterService!" exception. If I add an providers["FilterService"] statement to my @Component(...) definition, the exception doesn't occur, but the filtering done by my customFilter control doesn't apply at all, while the filtering done by the default filter is applied correctly.

For further information: If I use my filter control on a non wrapped kendo-grid, the filtering works just fine, so I assume, that the problem isn't located within my filter control, but more likely inside my grid wrapper, which doesn't transfer the FilterService instance to the FilterControl correctly.

Does anybody know, if there is a workaround for this without redoing the whole filtering process?

Answer 1

It appears that the service is not available through conventional means when your component is running outside of a kendo grid.

Marking the service as optional should allow your component to continue functioning.

  constructor(@Optional() filterService: FilterService) {
      super(filterService);
  }