wie Cordova Plugin in eckigen 4 Hybrid-Anwendung zu verwenden

Question

Ich bin neu in dieser Struktur. Ich bin Kamera-Plugin in Anwendung hinzugefügt und bauen Sie die Anwendung. Es wirft unter Fehler.

ERROR in D: /../ CordovaApp/src/app/Menüleiste/Menü-bar.component.ts (20.15): Immobilien 'Kamera' existiert nicht auf Typ 'N avigator' .

FEHLER in D:/../ CordovaApp/src/app/menu-bar/menu-bar.component.ts (23,16): Der Name 'Kamera' kann nicht gefunden werden.

Kann mir jemand helfen, dieses Problem loszuwerden.

/** aktualisierter Teil **/

Nach dem Hinzufügen von zwei Variablen in die Komponente. Anwendungserstellung erfolgreich, aber wenn ich eine Anwendung debugge, habe ich keine Plugin-Eigenschaft in den Navigator bekommen. Bitte beziehen Sie sich auf den beigefügten Schnappschuss.

click on this link to open snap shot

Answer 1

Typoskript ist eine typisierte Sprache. Also, wann immer Sie eine Javascript-basierte Bibliothek/Plugin verwenden, müssen Sie sicherstellen, dass der entsprechende Typ verfügbar ist.

Hier haben Sie den Navigator verwendet, der eigentlich JavaScript oder Cordova bekannt ist, aber Typoskript nicht bekannt ist, der diesen Fehler verursacht.

Es gibt zwei Möglichkeiten, dies zu lösen.

1. Installieren Sie die entsprechende Typdefinition. (http://definitelytyped.org/)
2. Deklarieren von Navigator als beliebig Typ.

@Component({ 
    selector: 'app', 
    template: `<button type="button" (touchend)="onCamera($event)">Camera</button>` 
}) 
export class AppComponent { 
    public onCamera(event) { 
    const cameraOptions = { 
     destinationType: (<any>Camera).DestinationType.FILE_URI 
    }; 
    (<any>navigator).camera.getPicture(cameraSuccess, cameraError, cameraOptions); 
    } 
} 

oder

declare var navigator: any; 
declare var Camera: any; 

@Component({ 
    selector: 'app', 
    template: `<button type="button" (touchend)="onCamera($event)">Camera</button>` 
}) 
export class AppComponent { 
    public onCamera(event) { 
    const cameraOptions = { 
     destinationType: Camera.DestinationType.FILE_URI 
    }; 
    navigator.camera.getPicture(cameraSuccess, cameraError, cameraOptions); 
    } 
}