0

Let's say I have this main component:

import { Component } from "@angular/core";

@Component({
    selector: "my-app",
    templateUrl: "./layouts/main-layout.html"
})
export class AppComponent {

    constructor(

    ){}

    ngAfterViewInit() {
        //console.log( com.google.android.gms.maps.CameraUpdateFactory );
    }

}

How can I call the commented-out function, right there in app.component.ts?

Because it gives me "com" not found error.

I have added dependencies { compile 'com.google.android.gms:play-services-maps:9.8.0' } in App_Resources/Android/app.gradle file.

I have also checked how nativescript-google-maps-sdk plugin does it. It seems it does it the same way - it has its' own nativescript-google-maps-sdk/platforms/android/include.gradle file, where it also defines the google play service maps from local android sdk, and in nativescript-google-maps-sdk/map-view.android.js I see it is using such a command without problem:

var cameraUpdate = com.google.android.gms.maps.CameraUpdateFactory.newCameraPosition( cameraPosition );

Any insights much appreciated.

Starwave
  • 2,352
  • 2
  • 23
  • 30

2 Answers2

4

You need to first understand why the error is occurring - missing TypeScript definitions for whatever com and what comes afterwards is. com is not a valid recognized object in TypeScript nor JavaScript, so you need to either

A) (BAD) instruct the TypeScript compiler to not complain about missing definitions, because you know better, you know that com.google.android.gms.maps.CameraUpdateFactory is a valid object. You disable noEmitOnErrors in tsconfig.json

B) (GOOD) provide typings (they normally come in the form of .d.ts) to "acquaint" TSC with the alien class. 

declare module com {
    export module google {
        export module android {
            export module gms {
                export module maps {
                    export class CameraUpdateFactory {
                        public static newCameraPosition(param0: any): any
                    }
                }
            }
        }
    }
}

let cameraUpdate: any = com.google.android.gms.maps.CameraUpdateFactory.newCameraPosition;

Or use let com: any if you cannot bother describing the whole namespace. Typings can be generated automatically for android/java libraries, but there is a certain limitation in TypeScript/JavaScript that currently prevents us from exporting google android library typings alongside the android.sdk and support library typings.

pkanev
  • 1,486
  • 1
  • 12
  • 20
3

add this to you file declare var com:any; and also read this How can I access Native api in NativeScript when I use Typescript

Community
  • 1
  • 1
Habib Kazemi
  • 2,172
  • 1
  • 24
  • 30
  • Omg, how could I forget about declaring it first... :D lol, yes, quick and nice fix, now I'm getting access to the classes/objects/functions. Kudos! – Starwave Nov 09 '16 at 12:12
  • The weird thing though is that when I included `dependencies { compile 'com.google.android.gms:play-services-maps:9.8.0' }`, my app did compile and build just fine, but when I opened it on Android phone it instantly crashed. So I removed that dependency, now it doesn't crash, however, where am I getting that sdk class from then? – Starwave Nov 09 '16 at 12:13
  • My guess - my app uses `nativescript-google-maps-sdk` plugin and it uses google maps from android sdk. Therefore, if I include this plugin in my project, it builds a global refference to this in-app google object, that's why when I access it within AppComponent with console.log, I doesn't throw an error. – Starwave Nov 09 '16 at 12:13
  • Btw, how can I extend the class which I now have a refference to? When I do `class FBMessagingService extends com.google.firebase.messaging.FirebaseMessagingService {}` I get an error saying `Type any is not a constructor function type` – Starwave Nov 09 '16 at 12:41
  • @Starwave you can do it as I have explained below -> describe the whole structure in TypeScript if one isn't readily available. It's a lot of boilerplate, but it's one of the trade-offs vs JavaScript. – pkanev Nov 09 '16 at 17:00