title: Angular 5 - google is not defined (Google Maps)
body: <p>I want to use google maps on my Angular 5 app, but I encourtered some problem.</p>
  
  <p>When view is loading I receive error in js console:</p>
  
  <pre><code>LoginComponent_Host.ngfactory.js? [sm]:1 ERROR ReferenceError: google is not defined 
  at LoginComponent.ngAfterViewInit (login.component.ts:15) 
  at callProviderLifecycles (core.js:12428)..
  </code></pre>
  
  <p>My component:</p>
  
  <pre><code>  import {AfterViewInit, Component} from '@angular/core';
      declare let google: any;
  
      @Component({
        selector: 'app-login',
        templateUrl: './login.component.html',
        styleUrls: ['./login.component.css']
      })
      export class LoginComponent implements AfterViewInit {
  
         ngAfterViewInit(): void {
            let origin = new google.maps.LatLng(4.0, 2.0 );
            let destination = new google.maps.LatLng(1.0, 1.5);
         }
  
         constructor() {}
      }
  </code></pre>
  
  <p>app.module.ts</p>
  
  <pre><code>import {AgmCoreModule} from '@agm/core';
  
  @NgModule({
    declarations: [
      AppComponent,
      LoginComponent
    ],
    imports: [
      BrowserModule,
      FormsModule,
      HttpModule,
      AppRoutingModule,
      AgmCoreModule.forRoot({
        apiKey: 'KEY'
      })
    ],
    providers: [],
    bootstrap: [AppComponent]
  })
  export class AppModule {}
  </code></pre>
  
  <p>I'm using AgmCoreModule installed by npm:</p>
  
  <pre><code>npm install @agm/core --save
  </code></pre>
  
  <p>I tried also importing LatLang class this way:</p>
  
  <pre><code>import LatLng = google.maps.LatLng;
  </code></pre>
  
  <p>And use script in my index.html</p>
  
  <pre><code>&lt;script src="https://maps.googleapis.com/maps/api/js?key=KEY&amp;libraries=places" async defer&gt;&lt;/script&gt;
  </code></pre>
  
  <p>But all the time I received same issues.
  Am I missing something?</p>