How to use Ionic cordoba-plugin-device module?

I'm trying to get device number in Ionic app with this but get the error:

ERROR in src/app/app.module.ts(47,5): error TS2322: Type 'DeviceOriginal' is not assignable to type 'Provider'. Type 'DeviceOriginal' is not assignable to type 'ClassProvider'. Property 'provide' is missing in type 'DeviceOriginal'. src/app/pages/place-detail/place-detail.page.ts(70,21): error TS2304: Cannot find name 'Device'.

When run $ ionic info:

Ionic:
  ionic (Ionic CLI)             : 4.9.0
  Ionic Framework               : @ionic/angular 4.8.0
  @angular-devkit/build-angular : 0.13.9
  @angular-devkit/schematics    : 7.2.4
  @angular/cli                  : 7.2.4
  @ionic/angular-toolkit        : 1.2.3

Cordova:
  cordova (Cordova CLI) : 9.0.0 ([email protected])
  Cordova Platforms     : android 8.0.0, browser 5.0.4, ios 5.0.1
  Cordova Plugins       : cordova-plugin-ionic 5.4.4, cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.1, (and 11 other plugins)

System:
  ios-deploy : 1.9.4
  ios-sim    : 8.0.2
  NodeJS     : v11.8.0    npm        : 6.9.0
  OS         : macOS
  Xcode      : Xcode 12.3 Build version 12C33

app.module.ts:

import { Device } from '@ionic-native/device';

...
providers: [
  ...
  Device,
  ...
]

package.json:

...
"dependencies": {
  ...
  "@ionic-native/device": "^4.20.0",
  "cordova-plugin-device": "^2.0.3",
  ...
"cordova": {
  "plugins": {
    "cordova-plugin-device": {
      "OKHTTP_VERSION": "3.10.0",
      "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
      ...
  },

detail.page.ts:

import { Device } from '@ionic-native/device';

constructor(
  ...
  private device: Device) {}

ngOnInit() {
  console.log('Device UUID is: ' + this.device.uuid);
}

Anybody could help me please ? Thanks in advance.

Upvotes: 0

Views: 1279

Answers (1)

Apps
Apps

Reputation: 3389

Include the Device in the providers in Main module of the Angular app. Sample code below

// app.module.ts
import { Device} from '@ionic-native/device';

...

@NgModule({
  ...

  providers: [
    ...
    Device
    ...
  ]
  ...
})
export class AppModule { }

Upvotes: 1

Related Questions