检查platform.ready不在电容器应用上

如何解决检查platform.ready不在电容器应用上

我开发了Angular and Capacitor应用程序。即这里没有离子

如何在本机平台await this.platform.ready();上进行检查。因为我需要像这样在App启动时使用Cordova插件：

app.component.ts

 constructor(
    private screenOrientation: ScreenOrientation) {

    this.initializeApp();
  }

private async initializeApp(): Promise<void> {

    //await this.platform.ready(); //cannot use here no Ionic
  

    if (Capacitor.isPluginAvailable('StatusBar')) { StatusBar.show(); }

    if (Capacitor.isNative) { this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT); }
  }

那这里有什么选择呢？

更新

这里的问题是我需要使用Firebase用户名/密码功能。但这会在本机版本的iOS设备上给出以下错误。

[错误]- {“代码”：“此环境不支持验证/操作”，“消息”：“此 此应用程序所在的环境不支持该操作 继续前进。 “ location.protocol”必须为http，https或 必须启用chrome-extension和网络存储。“}

我在这里从Google那里看到了一些东西。即他说Firebase监听设备就绪事件。

https://github.com/firebase/firebaseui-web/issues/178#issuecomment-310460472

即 此外，SDK将侦听“ deviceready”事件。如果没有在一秒钟内收到该信号，则它超时并假定您未在Cordova环境中运行。还要确保您没有禁用网络存储，因为该应用程序依赖于此。

那我该怎么办？

更新2

npx cap ls

Found 0 Capacitor plugins for android:
  Found 5 Cordova plugins for android
    cordova-plugin-ionic (5.4.7)
    cordova-plugin-screen-orientation (3.0.2)
    cordova-plugin-whitelist (1.3.4)
    es6-promise-plugin (4.2.2)
    phonegap-plugin-barcodescanner (8.1.0)
  Found 0 Capacitor plugins for ios:
  Found 4 Cordova plugins for ios
    cordova-plugin-ionic (5.4.7)
    cordova-plugin-screen-orientation (3.0.2)
    es6-promise-plugin (4.2.2)
    phonegap-plugin-barcodescanner (8.1.0)
  Found 1 incompatible Cordova plugin for ios,skipped install
    cordova-plugin-whitelist (1.3.4)
[info] Listing plugins for web is not possible

更新3

import { Component,HostListener,Inject,OnInit } from '@angular/core';
import { ScreenOrientation } from '@ionic-native/screen-orientation/ngx';
import { Capacitor,PluginRegistry,Plugins } from '@capacitor/core';

import { ScreenSizeService } from './core/services/data/screen-size.service';
import { AuthService } from './core/services/apis/auth.service';
import { MenubarService } from './core/services/data/menubar.service';
import { DOCUMENT } from '@angular/common';

const { StatusBar }: PluginRegistry = Plugins;

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

  constructor(
    public screenSizeService: ScreenSizeService,public authService: AuthService,private screenOrientation: ScreenOrientation,public menubarService: MenubarService,@Inject(DOCUMENT) private doc: any) {

    this.initializeApp();
  }



  private initializeApp(): void {

 
    if (Capacitor.isPluginAvailable('StatusBar')) { StatusBar.show(); }

      
    this.doc.addEventListener('deviceready',this.onDeviceReady,false);

  }

  onDeviceReady(): void {
    if (Capacitor.isNative) { this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT); }
    this.authService.setFirebaseAuth();
  }

 

}

解决方法

尝试使用Angular生命周期挂钩。可能可以通过

来实现

ngAfterViewInit() or ngAfterViewChecked()

,

如果您不想使用Ionic，则不能使用platform，因为它是Ionic的功能。

如果您只想等待deviceready事件，则可以直接通过

收听

document.addEventListener("deviceready",onDeviceReady,false);

function onDeviceReady() {
    // Now safe to use device APIs
}

无论如何，在电容器中，您无需等待设备就绪。