科爾多瓦應用使用Angular 2

Question

而不是離子我想用科爾多瓦框架。

到目前爲止，

步驟1：

我已創建的角2的應用程序。

步驟2：

我已經創建了一個應用科爾多瓦並在它集成角2的應用程序。

它運行成功。

步驟3：

下一步是上加載負載cordova.js文件

步驟4：

添加科爾多瓦插件（如照相機，裝置EXT）在我的項目。

第1步和第2步完成。

請幫我完成第3步和第4步。

當我打電話插件其如下拋出一個錯誤，

Answer 1

得到具有以下步驟的輸出，

1）創建的角項目

（可選）我使用angular IDE創建角項目

2）添加參考cordova.js文件在角度項目html文件中引用。

<script type="text/javascript" src="cordova.js"></script> 

3）創建科爾多瓦項目

4）新增平臺和插件到科爾多瓦項目。

對於我的情況，我添加了瀏覽器平臺和cordova設備插件。

5）在實現OnIt的角度項目中添加了插件回調函數，如下所示。

注：調用科爾多瓦插件是非常重要的後 'onDeviceReady'

import { Component , OnInit} from '@angular/core'; 

    @Component({ 
     selector: 'app-root', 
     templateUrl: './app.component.html', 
     styleUrls: ['./app.component.css'] 
    }) 
    export class AppComponent implements OnInit{ 

    ngOnInit() { 
     document.addEventListener("deviceready", onDeviceReady, false); 
     function onDeviceReady() { 
      alert(device.platform); 
     } 
    } 

    } 

6）打字稿不recogonise「設備。平臺「並警告如找不到設備

要解決此問題，添加行」 申報無功裝置;'

後加入以上我AppComponent.ts文件看起來像如下，

import { Component , OnInit} from '@angular/core'; 

declare var device; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent implements OnInit{ 

ngOnInit() { 
    document.addEventListener("deviceready", onDeviceReady, false); 
     function onDeviceReady() { 
      alert(device.platform); 
     } 
} 

} 

7）建立角項目和構建文件複製到科爾多瓦/ WWW文件夾

我現在用的是腳本將文件從角度項目複製到科爾多瓦。 Tutorial here

8）準備並運行cordova項目。

對於我來說，我跑在瀏覽器中的科爾多瓦項目，並得到了與價值「瀏覽器」的警報

Answer 2

當你調用插件 - 你還等onDeviceReady火？

Answer 3

這不是一個官方的解決辦法，但你可以用onDeviceReady事件監聽器上maint.ts引導你的角度2,4，然後所有當事件被觸發時，你的應用程序將運行。例如：

document.addEventListener("deviceready",() => { 
    platformBrowserDynamic().bootstrapModule(AppModule); 
}, false);