title: NullInjectorError: No provider for ViewportScroller
body: <p>I'm building a simple angular application, using Angular Material to desing the front-end.
  The app just have 2 components rendered in the same page. When I serve the app, this is returned in the console:</p>
  
  <p>NullInjectorError: "StaticInjectorError(AppModule)[RouterScroller -> ViewportScroller]: 
    StaticInjectorError(Platform: core)[RouterScroller -> ViewportScroller]: 
      NullInjectorError: No provider for ViewportScroller!"</p>
  
  <p>AppModule.ts</p>
  
  <pre><code>          import { BrowserModule } from '@angular/platform-browser';
        import { NgModule } from '@angular/core';
  
        import { AppRoutingModule } from './app-routing.module';
        import { AppComponent } from './app.component';
        import { Material } from './Material';
        import { DataFormComponent } from './data-form/data-form.component';
        import { TemplateFormComponent } from './template-form/template-form.component';
        import { FormsModule } from '@angular/forms';
  
  
        @NgModule({
          declarations: [
            AppComponent,
            DataFormComponent,
            TemplateFormComponent,
          ],
          imports: [
            BrowserModule,
            AppRoutingModule,
            Material,
            FormsModule
          ],
          providers: [],
          bootstrap: [AppComponent]
        })
        export class AppModule { }
  </code></pre>
  
  <p>appComponents.ts</p>
  
  <pre><code>import { Component } from '@angular/core';
  </code></pre>
  
  <p>Material.ts(module for all angular material components)</p>
  
  <pre><code>                import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
              import {NgModule} from '@angular/core';
              import {MatTabsModule} from '@angular/material/tabs';
              import {MatInputModule} from '@angular/material';
              import {MatCardModule} from '@angular/material/card';
              import {MatToolbarModule} from '@angular/material/toolbar';
              import {MatFormFieldModule} from '@angular/material/form-field';
              import {MatButtonModule} from '@angular/material/button';
  
              @NgModule({
                  imports:
                  [
                      BrowserAnimationsModule,
                      MatTabsModule,
                      MatCardModule,
                      MatToolbarModule,
                      MatFormFieldModule,
                      MatInputModule,
                      MatButtonModule
                  ],
                  exports:
                  [
                      BrowserAnimationsModule,
                      MatTabsModule,
                      MatCardModule,
                      MatToolbarModule,
                      MatFormFieldModule,
                      MatInputModule,
                      MatButtonModule
                  ],
              })
              export class Material { }
  
              @Component({
                selector: 'app-root',
                templateUrl: './app.component.html',
                styleUrls: ['./app.component.css']
              })
              export class AppComponent {
                title = 'forms';
              }
  </code></pre>
  
  <p>AppRoutingModule.ts:</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { Routes, RouterModule } from '@angular/router';
  import { CursoModule } from './curso/curso.module';
  
  const routes: Routes = [
   { 
    path: '', pathMatch: 'full', redirectTo: 'curso'
   },
   { 
    path: 'curso', loadChildren: './curso/curso.module#CursoModule'
    }
  ];
  
  @NgModule({
   imports: [RouterModule.forRoot(routes)],
   exports: [RouterModule]
  })
  export class AppRoutingModule { }
  </code></pre>
  
  <p>cursp-routing.module.ts:</p>
  
  <pre><code>import { CursosComponent } from './cursos.component';
  import { RouterModule } from '@angular/router';
  import { NgModule } from '@angular/core';
  import { CursoListaComponent } from './curso-lista/curso-lista.component';
  
      const routes = [
      {
          path: '', component: CursoListaComponent
      }
      ]
  
  
   @NgModule({
    imports: [RouterModule.forChild(routes)],
    exports: [RouterModule]
   })
   export class CursoRouting { }
  </code></pre>