title: Unexpected directive 'MatSpinner' imported by the module 'AppModule'. Please add a @NgModule annotation
body: <p>Angular 5 -</p>
  
  <p>here are the npm modules (package.json)-</p>
  
  <pre><code>   "@angular/animations": "^5.0.0",
      "@angular/cdk": "^5.0.0-rc.2",
      "@angular/common": "^5.0.0",
      "@angular/compiler": "^5.0.0",
      "@angular/core": "^5.0.0",
      "@angular/forms": "^5.0.0",
      "@angular/http": "^5.0.0",
      "@angular/material": "^5.0.0-rc.2",
      "@angular/platform-browser": "^5.0.0",
      "@angular/platform-browser-dynamic": "^5.0.0",
      "@angular/router": "^5.0.0",
      "core-js": "^2.4.1",
      "hammerjs": "^2.0.8",
      "rxjs": "^5.5.2",
      "zone.js": "^0.8.14"
  </code></pre>
  
  <p>I am using Angular material Spinner as MatSpinner Directive from Material module</p>
  
  <pre><code>import { MatSpinner } from "@angular/material";
  @NgModule({
  imports: [
  
  MatSpinner
  ],
  declarations: [],
  providers: [],
  bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <p>Here is the HTML:</p>
  
  <pre><code>&lt;mat-spinner&gt;&lt;/mat-spinner&gt;
  </code></pre>
  
  <p>I am Getting an ERROR-</p>
  
  <p><strong>Unexpected directive 'MatSpinner' imported by the module 'AppModule'. Please add a @NgModule annotation.</strong></p>