$cordovaBatteryStatus

cordova
1

Hi Guys,

Could anyone show a demo of how $cordovaBatteryStatus plugin could be included in a Project?

$rootScope.$on('$cordovaBatteryStatus:status', function (result) { $scope.batteryLevel = result.level; $scope.isPluggedIn = result.isPlugged; });

It doesn’t show value of batterLevel on view?

Thanks in advance.

2

You must register the fonction in an event:

document.addEventListener(“deviceready”, function () {
$rootScope.$on(‘$cordovaBatteryStatus:status’, function (result) {
$scope.batteryLevel = result.level; // (0 - 100)
$scope.isPluggedIn = result.isPlugged; // bool
});
}, false);

3

Hi @jimibi

Thanks for the reply. I’m confused on how to wrap this inside a function or how to call this function from ng-click event.

 document.addEventListener("deviceready", function () {
$scope.myFunction=function(){
     $rootScope.$on('$cordovaBatteryStatus:status', function (result) {
        $scope.batteryLevel = result.level;       // (0 - 100)
        $scope.isPluggedIn  = result.isPlugged;   // bool
     });
};

And, call myFunction() on ng-click doesn’t work? Could you please have a look.

4

It is not possible to attach the function to a ng-click. The values are only updated when the state of the battery move for 1% and if the charger is plugged or unplugged.

if you really want an ng-click, you can make this :

$scope.battery = function () {
$scope.value2 = $scope.batteryLevel;
$scope.value1 = $scope.isPluggedIn;
}

and in the HTML : <div ng-click=">battery()"></div>

but the value will be defined that after the first event.

Otherwise you can simply display the values in a div, the value will be updated automatically.

 <div>
    <h3>Battery level: {{batteryLevel}} %<h3>
    <h3>Charger: {{</h3>isPluggedIn}}</h3>
</div>
5

@jimibi

Just a quick question : Where do you call the API of $cordovaBatteryStatus in the function?

Do you mean to frame the function this way:

   $scope.myFunction=function(){
     $rootScope.$on('$cordovaBatteryStatus:status', function (result) {
       $scope.battery = function () {
       $scope.value2 = $scope.batteryLevel;
       $scope.value1 = $scope.isPluggedIn;
 }
     });
};

Thank you.

6

I think it does not work like that

7

Hi @jimibi,

Could you please show code that works. Not sure where API gets called in code you mentioned?

Thank you.

8

if i use below code it shows battery status

$rootScope.$on(’$cordovaBatteryStatus:status’, function (result) {
var batteryLevel = result.level; // (0 - 100)
var isPluggedIn = result.isPlugged; // bool
});

 }, false);
9

I have the same question. I can show the battery status in an alert message, but I want to show the status in the view. Can someone tell me how to do this in Ionic V2?

My view home.html

`<ion-navbar *navbar>

Battery status: {{batteryLevel}}

Get Network Connection `

home.js

`import {Page, Platform} from ‘ionic-angular’;

window.addEventListener(“batterystatus”, onBatteryStatus, false);
function onBatteryStatus(info){
alert('battery status: ‘+info.level+’ isPlugged: '+info.isPlugged);
batteryLevel = info.level;
}

@Page({
templateUrl: ‘build/pages/home/home.html’,
})
export class HomePage {
constructor(platform, batteryLevel) {
this.platform = platform;
this.batteryLevel = batteryLevel;
}

static get parameters(){
return [[Platform], [BatteryLevel]];
}

obtainNetworkConnection() {
this.platform.ready().then(() => {
this.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';

    alert('Connection type: ' + states[this.networkState]);
});

}

}
`