Event deviceready: how it works?

Ionic Native
1

I have to wrap ScreenOrientation and Device (for AndroidPermissions) into the deviceready event. But deviceready is never fired.

Apart from the deviceready event, my app works as expected. And I use the native function BarcodeScanner and have several views that consume a REST API.

My “not working” code at first.

app.component.ts

import { Device } from '@ionic-native/device/ngx';
import { ScreenOrientation } from '@ionic-native/screen-orientation/ngx';
import { AndroidPermissions } from '@ionic-native/android-permissions';

  constructor(private device: Device, private screenOrientation: ScreenOrientation, private androidPermissions: AndroidPermissions) {
    document.addEventListener('deviceready', this.onDeviceReady, false);
  }

  onDeviceReady() {
    console.log('device is ready');
    this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT_PRIMARY);

    if (this.device.platform == 'Android') {
      console.log(this.device.platform);
      this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.INTERNET).then(
        result => console.log('Has permission?', result.hasPermission),
        error => this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.INTERNET)
      );
    }
  }

The function onDeviceReady() is never called.

ionic info

Ionic:

   ionic (Ionic CLI)  : 4.10.1 (/usr/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.1, browser 5.0.4
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.1.4, (and 9 other plugins)

System:

   Android SDK Tools : 26.1.1 (/opt/google/android/sdk)
   NodeJS            : v8.15.0 (/usr/bin/node)
   npm               : 6.7.0
   OS                : Linux 4.15

How do you implement it correctly?
Why is deviceready not fired with my code?

2

onDeviceReady() isn’t a thing, neither in Cordova nor in Angular

you could inject the Platform and wait for the ready() promise

platform.ready().then(() => {
   console.log('the platform is ready');
}
3

OnDeviceReady() I implemented myself in the class.

platform.ready().then() is not enough!? If I use Device there there are the following error:

Error: Uncaught (in promise): TypeError: Object(...) is not a function
TypeError: Object(...) is not a function
 at Device.get [as platform] (http://localhost:8100/build/vendor.js:84739:113)

The following is not working and throws similar (at ScreenOrientation.lock) error:


    this.platform.ready().then(() => {
      this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT_PRIMARY);

      if (this.device.platform == 'Android') {
        this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.INTERNET).then(
          result => console.log('Has permission?', result.hasPermission),
          error => this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.INTERNET)
        );
      }
    });

How do you implement it correctly?

4

This error was reported and documented at least hundred times on the forum, often it’s linked to the fact that the native wrapper (“Ionic native”) hasn’t correctly been use with Ionic v4. (check that you are using Ionic Native v5 and import with /ngx and that you add the provider in your app.module)

5

thanks, it seems i am one step further.

My package.json now has core v5:
"@ionic-native/core": "^5.0.0"

import @ionic-native/core/ngx throws: module not found

app.modules.ts

import { IonicNativePlugin } from '@ionic-native/core';

…and put IonicNativePlugin under provider throws: Object(…) is not a function

If there are solutions to the problem here in the forum, can you show me one? My search is not successful.

6

I have no idea what’s that, doesn’t sound correct, remove it