Состояние батареи Cordova и подключение к сети в приложении Ionic 2?

Question

Я новичок в Ionic framework.

• Я пытаюсь показать network connection and battery status in my app home page. на данный момент мы получили решение network connection. но мы изо всех сил пытаемся показать battery status Может кто-нибудь, пожалуйста, сообщите мне, как показать состояние батареи устройства в приложении Ionic 2? Я нашел плагин cordovaBatteryStatushttps://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> 

Мои home.ts: -

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(); 
     }); 
    } 
} 

• Указанные коды используются для отображения Battery Status and Device Network connection. Но Network Connection отлично работает, он показывает Device Network connection.

• Мы сделали почти мы пытаемся отобразить Device Battery Status and Network Connection, В настоящее время мы получили network connection решение, но теперь мы изо всех сил, чтобы получить battery status решение ....

• Поэтому, пожалуйста, вы можете проверить свои коды и предоставить точное решение, мы не знаем, где мы допустили ошибку в home.ts and home.html. Спасибо заранее ...

Answer 1

Вы неправильно idea..You добавляет обработчик события onChange. Он срабатывает только при изменении состояния батареи. Он не может печатать при каждом нажатии кнопки. Все это делает замену слушателя событий на каждом нажатии кнопки Есть класс переменной status

В конструкторе подписываться в platform.ready() и установить переменные состояния в функции обратного вызова. Вы можете отобразить значение статуса в предупреждении при нажатии кнопки.

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; 
    }); 
    }); 
} 

В зависимости от того, как вы хотели бы, чтобы показать состояние батареи,

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

Поскольку статус устанавливается асинхронно использовать ? в качестве проверки для undefined .Value будет обновляться один раз изменен.

Answer 2

• Для сети connection⚡️ вы могли бы использовать https://ionicframework.com/docs/v2/native/network/

• Для статуса батареи можно использовать https://ionicframework.com/docs/v2/native/battery-status/

• Для Других диагностик ⚕️ вы могли бы использование https://ionicframework.com/docs/v2/native/diagnostic/

Обратите внимание, что плагины не привязаны к Ionic 2, вы можете использовать их и в других проектах Кордовы.