title: Can't bind to 'filter' since it isn't a known property of 'kendo-grid'
body: <p>we're using (hoping to be able to use) Angular 4 with the full service Kendo Grid (filter, sorting, paging etc). The simple grid works as well as pagination but when I try to add filtering I get the following:</p>
  
  <pre><code>Unhandled Promise rejection: Template parse errors:
  Can't bind to 'filter' since it isn't a known property of 'kendo-grid'.
  1. If 'kendo-grid' is an Angular component and it has 'filter' input, then verify that it is part of this module.
  2. If 'kendo-grid' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
  3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("      [pageSize]="state.take"
                          [skip]="state.skip"
                          [ERROR -&gt;][filter]="state.filter"
                          [pageable]="true"
                          [filterab"): ng:///app/securityGroupComponent.html@26:24
  Can't bind to 'filterable' since it isn't a known property of 'kendo-grid'...
  </code></pre>
  
  <p>I can't identify what is different between my set-up and the docs. Thanks for any help you can provide.</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { process, State } from '@progress/kendo-data-query';
  
  import {
      GridComponent,
      GridDataResult,
      DataStateChangeEvent
  } from '@progress/kendo-angular-grid';
  
  @Component({
      selector: 'test',
      template: `
  &lt;kendo-grid
          [data]="gridData"
          [pageSize]="state.take"
          [skip]="state.skip"
          [sort]="state.sort"
          [filter]="state.filter"
          [sortable]="true"
          [pageable]="true"
          [filterable]="true"
          (dataStateChange)="dataStateChange($event)"
      &gt;
      &lt;kendo-grid-column field="ProductID" title="ID" width="40" [filterable]="false"&gt;
      &lt;/kendo-grid-column&gt;
      &lt;kendo-grid-column field="ProductName" title="Product Name"&gt;
      &lt;/kendo-grid-column&gt;
      &lt;kendo-grid-column field="FirstOrderedOn" title="First Ordered On" width="240" filter="date" format="{0:d}"&gt;
      &lt;/kendo-grid-column&gt;
      &lt;kendo-grid-column field="UnitPrice" title="Unit Price" width="180" filter="numeric" format="{0:c}"&gt;
      &lt;/kendo-grid-column&gt;
      &lt;kendo-grid-column field="Discontinued" width="120" filter="boolean"&gt;
          &lt;ng-template kendoGridCellTemplate let-dataItem&gt;
              &lt;input type="checkbox" [checked]="dataItem.Discontinued" disabled/&gt;
          &lt;/ng-template&gt;
      &lt;/kendo-grid-column&gt;
      &lt;/kendo-grid&gt;
  `
  })
  export class test {
  
      private state: State = {
          skip: 0,
          take: 5
      };
      private sampleProducts = [
          {
              "ProductID": 1,
              "ProductName": "Chai",
              "SupplierID": 1,
              "CategoryID": 1,
              "QuantityPerUnit": "10 boxes x 20 bags",
              "UnitPrice": 18,
              "UnitsInStock": 39,
              "UnitsOnOrder": 0,
              "ReorderLevel": 10,
              "Discontinued": false,
              "Category": {
                  "CategoryID": 1,
                  "CategoryName": "Beverages",
                  "Description": "Soft drinks, coffees, teas, beers, and ales"
              },
              "FirstOrderedOn": new Date(1996, 8, 20)
          },
          {
              "ProductID": 2,
              "ProductName": "Chang",
              "SupplierID": 1,
              "CategoryID": 1,
              "QuantityPerUnit": "24 - 12 oz bottles",
              "UnitPrice": 19,
              "UnitsInStock": 17,
              "UnitsOnOrder": 40,
              "ReorderLevel": 25,
              "Discontinued": false,
              "Category": {
                  "CategoryID": 1,
                  "CategoryName": "Beverages",
                  "Description": "Soft drinks, coffees, teas, beers, and ales"
              },
              "FirstOrderedOn": new Date(1996, 7, 12)
          },
          {
              "ProductID": 3,
              "ProductName": "Aniseed Syrup",
              "SupplierID": 1,
              "CategoryID": 2,
              "QuantityPerUnit": "12 - 550 ml bottles",
              "UnitPrice": 10,
              "UnitsInStock": 13,
              "UnitsOnOrder": 70,
              "ReorderLevel": 25,
              "Discontinued": false,
              "Category": {
                  "CategoryID": 2,
                  "CategoryName": "Condiments",
                  "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
              },
              "FirstOrderedOn": new Date(1996, 8, 26)
          },
          {
              "ProductID": 4,
              "ProductName": "Chef Anton's Cajun Seasoning",
              "SupplierID": 2,
              "CategoryID": 2,
              "QuantityPerUnit": "48 - 6 oz jars",
              "UnitPrice": 22,
              "UnitsInStock": 53,
              "UnitsOnOrder": 0,
              "ReorderLevel": 0,
              "Discontinued": false,
              "Category": {
                  "CategoryID": 2,
                  "CategoryName": "Condiments",
                  "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
              },
              "FirstOrderedOn": new Date(1996, 9, 19)
          },
          {
              "ProductID": 5,
              "ProductName": "Chef Anton's Gumbo Mix",
              "SupplierID": 2,
              "CategoryID": 2,
              "QuantityPerUnit": "36 boxes",
              "UnitPrice": 21.35,
              "UnitsInStock": 0,
              "UnitsOnOrder": 0,
              "ReorderLevel": 0,
              "Discontinued": true,
              "Category": {
                  "CategoryID": 2,
                  "CategoryName": "Condiments",
                  "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
              },
              "FirstOrderedOn": new Date(1996, 7, 17)
          },
          {
              "ProductID": 6,
              "ProductName": "Grandma's Boysenberry Spread",
              "SupplierID": 3,
              "CategoryID": 2,
              "QuantityPerUnit": "12 - 8 oz jars",
              "UnitPrice": 25,
              "UnitsInStock": 120,
              "UnitsOnOrder": 0,
              "ReorderLevel": 25,
              "Discontinued": false,
              "Category": {
                  "CategoryID": 2,
                  "CategoryName": "Condiments",
                  "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
              },
              "FirstOrderedOn": new Date(1996, 9, 19)
          }]
  
      private gridData: GridDataResult = process(this.sampleProducts, this.state);
  
      protected dataStateChange(state: DataStateChangeEvent): void {
          this.state = state;
          this.gridData = process(this.sampleProducts, this.state);
      }
  
  
  }
  </code></pre>
  
  <p>app.module.ts</p>
  
  <pre><code> import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';  
  import { BrowserModule } from '@angular/platform-browser';
  import { FormsModule } from '@angular/forms';
  import { HttpModule } from '@angular/http';
  
  import { SecurityGroupService } from "./services/securityGroupService";
  import { SecurityGroupComponent } from "./securityGroupComponent";
  import { AppComponent } from './app.component';
  
  import { GridModule } from '@progress/kendo-angular-grid/';
  
  import { test } from './test';
  
  import { ButtonsModule } from '@progress/kendo-angular-buttons';
  @NgModule({
      imports: [
          BrowserModule,
          ButtonsModule,
          CommonModule,
          GridModule,
          FormsModule,
          HttpModule        
      ],
      declarations: [
          AppComponent,
          SecurityGroupComponent,
          test
      ],
      bootstrap: [AppComponent],
      providers: [SecurityGroupService]
  })
  export class AppModule { }
  </code></pre>