title: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[tabindex]
body: <p>I am getting this strange error from my very basic application currently. I cant get the application to run due to this issue. It seems like some vital bit of information is missing from the exception. Im sure i have all the imports/etc correct</p>
  
  <pre><code>core.js:7187 ERROR Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[tabindex]: 
    StaticInjectorError(Platform: core)[tabindex]: 
      NullInjectorError: No provider for tabindex!
  NullInjectorError: StaticInjectorError(AppModule)[tabindex]: 
    StaticInjectorError(Platform: core)[tabindex]: 
      NullInjectorError: No provider for tabindex!
      at NullInjector.get (core.js:1354)
      at resolveToken (core.js:1681)
      at tryResolveToken (core.js:1607)
      at StaticInjector.get (core.js:1470)
      at resolveToken (core.js:1681)
      at tryResolveToken (core.js:1607)
      at StaticInjector.get (core.js:1470)
      at resolveNgModuleDep (core.js:23104)
      at _createClass (core.js:23181)
      at _createProviderInstance (core.js:23137)
      at resolvePromise (zone-evergreen.js:797)
      at resolvePromise (zone-evergreen.js:754)
      at zone-evergreen.js:858
      at ZoneDelegate.invokeTask (zone-evergreen.js:391)
      at Object.onInvokeTask (core.js:30873)
      at ZoneDelegate.invokeTask (zone-evergreen.js:390)
      at Zone.runTask (zone-evergreen.js:168)
      at drainMicroTaskQueue (zone-evergreen.js:559)
  </code></pre>
  
  <p>My components:</p>
  
  <p>home.component.ts</p>
  
  <pre><code>import {Component, OnInit} from '@angular/core';
  import {RouterLink} from '@angular/router';
  import {CookieService} from 'ngx-cookie-service';
  import {Observable} from 'rxjs';
  import {ApiClientService} from '../helpers/api-client.service';
  
  @Component({
    selector: 'app-home',
    templateUrl: './home.component.html',
  })
  export class HomeComponent implements OnInit {
    constructor(private router: RouterLink,
                private cookieService: CookieService,
                private apiClient: ApiClientService) {
    }
  
    topTracks: Observable&lt;string&gt;;
  
    ngOnInit(): void {
      debugger;
      const cookieVal = this.cookieService.get('token');
      if (cookieVal === '') {
        this.apiClient.login().subscribe(token =&gt; {
          this.cookieService.set('token', token);
          this.topTracks = this.apiClient.getTopTracks(token);
        });
      } else {
        this.topTracks = this.apiClient.getTopTracks(cookieVal);
      }
    }
  }
  </code></pre>
  
  <p>Authentication component:</p>
  
  <pre><code> import {Component, Inject, OnInit} from '@angular/core';
  import {HttpClient} from '@angular/common/http';
  import {ActivatedRoute, Router, RouterLink} from '@angular/router';
  import {CookieService} from 'ngx-cookie-service';
  import {ApiClientService} from '../helpers/api-client.service';
  
  @Component({
    selector: 'app-authentication',
    templateUrl: './authentication.component.html',
    styleUrls: ['./authentication.component.css']
  })
  export class AuthenticationComponent implements OnInit {
    private code: any;
  
    constructor(private httpClient: ApiClientService,
                private routerLink: ActivatedRoute,
                private cookieService: CookieService,
                private router: Router) { }
  
    ngOnInit() {
      this.routerLink.queryParams.subscribe(param =&gt; {
        this.code = param['code'];
        this.httpClient.swapCode(this.code).subscribe(retVal =&gt; {
          this.cookieService.set('token', retVal);
          this.router.navigateByUrl('/home');
        });
      });
    }
  
  }
  </code></pre>
  
  <p>and app Module</p>
  
  <p>i</p>
  
  <pre><code>mport { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import { FormsModule } from '@angular/forms';
  import {HttpClientModule, HTTP_INTERCEPTORS, HttpClient} from '@angular/common/http';
  import {Router, RouterLink, RouterModule} from '@angular/router';
  import { AppComponent } from './app.component';
  import { HomeComponent } from './home/home.component';
  import { AuthenticationComponent } from './authentication/authentication.component';
  import {CookieService} from 'ngx-cookie-service';
  import {ApiClientService} from './helpers/api-client.service';
  
  
  @NgModule({
    declarations: [
      AppComponent,
      HomeComponent,
      AuthenticationComponent
    ],
    imports: [
      BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
      HttpClientModule,
      FormsModule,
      RouterModule.forRoot([
        { path: '', component: HomeComponent, pathMatch: 'full' },
        { path: 'authenticate/:code', component: AuthenticationComponent, pathMatch: 'full' },
      ])
    ],
    providers: [RouterLink, CookieService, ApiClientService, HttpClient],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <p>and my api client:</p>
  
  <pre><code>import {Inject, Injectable} from '@angular/core';
  import {HttpClient} from '@angular/common/http';
  import {Observable} from 'rxjs';
  
  @Injectable({
    providedIn: 'root'
  })
  export class ApiClientService {
    constructor(private httpClient: HttpClient, @Inject('BASE_API_URL') private baseUrl: string) {
    }
  
    login(): Observable&lt;string&gt; {
      return this.httpClient.get&lt;string&gt;(this.baseUrl + 'api/Authentication/AuthenticateAuth');
    }
  
    swapCode(code: any) {
      return this.httpClient.get&lt;string&gt;(this.baseUrl + 'api/Authentication/code/' + code);
    }
  
    getTopTracks(cookieVal: string) {
      return this.httpClient.get&lt;string&gt;(this.baseUrl + 'api/Spotify/Top/' + cookieVal);
    }
  }
  </code></pre>