Cordova   发布时间:2022-05-03  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了角度 – 在Ionic 2应用中的Cordova电池状态和网络连接?大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

概述

我是Ionic框架的新手. >我正在尝试在我的应用主页中显示网络连接和电池状态.截至目前我们已获得网络连接解决方​​案.但我们努力显示电池状态有人可以请我提供如何在Ionic 2应用程序中显示设备电池状态吗?我找到了cordovaBatteryStatus插件https://github.com/apache/cordova-plugin-battery-status. >我已经安装了插件, 我的
我是Ionic框架的新手.

>我正在尝试在我的应用主页中显示网络连接和电池状态.截至目前我们已获得网络连接解决方​​案.但我们努力显示电池状态有人可以请我提供如何在Ionic 2应用程序中显示设备电池状态吗?我找到了cordovaBatteryStatus插件https://github.com/apache/cordova-plugin-battery-status.
>我已经安装了插件,

我的home.html: –

<h2>Battery status: {{BatteryStatus}}</h2>
<ion-content class="home" padding>
    <button ion-button color="priMary" (click)="checkNetwork()" full>Get Nettwork Connection</button>
</ion-content>

我的家.: –

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

import { NavController } from 'ionic-angular';
import { AlertController,Platform} from 'ionic-angular';
import { BatteryStatus } from 'ionic-native';

declare var batteryLevel: any;
declare var navigator: any;
declare var Connection: any;



@Component({
  SELEctor: 'page-home',templateUrl: 'home.html'
})
export class HomePage {

  hideTopTab:Boolean=true;
   x(){
 console.log(this.hideTopTab);

    this.hideTopTab = !this.hideTopTab;
}

// hideBottomTab:Boolean=true;
//    y(){
//  console.log(this.hideBottomTab);

//     this.hideBottomTab = !this.hideBottomTab;
// }
status:any;
  constructor(public alert:AlertController,public navCtrl: NavController,public platform: Platform) {
this.platform.ready().then(()=>{
  let subscription = BatteryStatus.onChange().subscribe( (status) => { 
    console.log(status.level,status.isPlugged); 
    this.status=status.level;
    } );
   } );

  }

  onBatteryStatus(info){
  alert('battery status: '+info.level+' isPlugged: '+info.isPlugged);
  batteryLevel = info.level;
}

checkNetwork() {
        this.platform.ready().then(() => {
            var networkState = navigator.connection.type;
            var states = {};
            states[Connection.UNKNowN]  = 'UnkNown connection';
            states[Connection.ETHERNET] = 'Ethernet connection';
            states[Connection.WIFI]     = 'WiFi connection';
            states[Connection.CELL_2G]  = 'Cell 2G connection';
            states[Connection.CELL_3G]  = 'Cell 3G connection';
            states[Connection.CELL_4G]  = 'Cell 4G connection';
            states[Connection.CELL]     = 'Cell generic connection';
            states[Connection.NONE]     = 'No network connection';
            let alert = this.alert.create({
                title: "Connection Status",subtitle: states[networkState],buttons: ["OK"]
            });
            alert.present();
        });
    }
}

>以上代码用于显示电池状态和设备网络连接.但网络连接正在完美地显示设备网络连接.
>我们几乎已经尝试显示设备电池状态和网络连接,截至目前我们已经获得了网络连接解决方​​案,但现在我们正在努力获得电池状态解决方案….
>那么请你检查我的代码并提供确切的解决方案,我们不知道我们在home.ts和home.html中的错误.先感谢您…

解决方法

你有错误的想法..你正在为onChange事件添加一个处理程序.它仅在电池状态改变时才会启动.每次按键点击都可能无法打印.
它所做的就是在每次点击按钮时替换事件监听器
一个类变量状态

在构造函数订阅platform.ready()并在回调中设置状态变量.
您可以在按钮单击时在警报中显示状态值.

status:any;
        constructor(public alert:AlertController,public platform: Platform) { 
    this.platform.ready().then(()=>{
    let subscription = BatteryStatus.onChange().subscribe( (status) => { 
    console.log(status.level,status.isPlugged); 
    this.status=status.level;
    } );
   } );
}

根据您希望显示电池状态的方式,

<h2>Battery status: {{status?.level}}</h2>
<h2>Battery is plugged:{{status?.isPluggeD}}</h2>

由于状态是异步设置使用?作为undefined的检查.一旦更改,将更新值.

大佬总结

以上是大佬教程为你收集整理的角度 – 在Ionic 2应用中的Cordova电池状态和网络连接?全部内容,希望文章能够帮你解决角度 – 在Ionic 2应用中的Cordova电池状态和网络连接?所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。