Verwenden des Batteriemanagers in eckigen js

Binvention

Ich versuche, das Batteriemanager-Objekt mit einem Winkel-Controller zu verbinden, aber das Controller-Objekt scheint nicht aktualisiert zu werden, wenn das Versprechen navigator.getBattery()vollständig ist. Hier ist, was ich mir ausgedacht habe

(function(){
var app=angular.module('appBattery',[]);
app.controller('batteryController',['$window',function($window){
this.bat={};
this.level=this.bat.level;
$window.navigator.getBattery().then(function(battery){
    setBattery(battery);
});
function setBattery(battery){
    this.bat=battery;
    console.log(this.bat);
}
console.log(this.bat);
}]);
})();

mit diesem HTML

<div ng-app='appBattery'>
<div id="battery-status-bar" ng-controller='batteryController as battery'>
    <div class="battery">
        <div class="power">
        {{battery}}
            <div class="level"></div>
        </div>
    </div>
    <div class="percentage">{{battery.bat.level}}</div>
    <div class="time">{{battery.bat.chargeTime +':'+battery.bat.dischargeTime}}</div>
</div>
</div>

es kann auch auf jsfiddle hier gefunden werden

rtucker88

Sie können Ihren Controller als Syntax behalten. Schauen Sie sich meine aktualisierte Geige unter https://jsfiddle.net/fnnruzjw/1/ an . Es gab ein paar Probleme:

Sie mussten $ scope. $ Apply verwenden.

$window.navigator.getBattery().then(function(battery){
	$scope.$apply(function() {
    setBattery(battery);
  });
});

Ihr dies bezog sich auf das falsche dies (ich habe es geändert, um vm zu sein, wie es eine populäre Konvention ist).

Sie haben den Verweis auf Ihr Batterieobjekt verloren, als Sie es neu zugewiesen haben. Ich habe angle.copy verwendet, um die Referenz zu behalten.

function setBattery(battery){
  angular.copy(battery, vm.bat);
	console.log(vm.bat);
}

Dieser Artikel stammt aus dem Internet. Bitte geben Sie beim Nachdruck die Quelle an.

Bei Verstößen wenden Sie sich bitte [email protected] Löschen.

bearbeiten am
0

Lass mich ein paar Worte sagen

0Kommentare
LoginNach der Teilnahme an der Überprüfung

Verwandte Artikel

TOP Liste

  1. 1

    Modbus Python Schneider PM5300

  2. 2

    Glassfish v3.0.1 im Vergleich zu Oracle GlassFish Server 3.0.1 - Gibt es einen technischen Grund, die kommerzielle Version zu verwenden?

  3. 3

    Wie schließe ich mehrere Ordner mit der Variablen EXTRA_ARGS aus?

  4. 4

    Wie kann eine gleichmäßige Lastverteilung in ElasticSearch mit Indizes mit unterschiedlicher Anzahl von Shards erreicht werden?

  5. 5

    Wie kann man eine Multi-Container-Anwendung in Steuerkarten erstellen?

  6. 6

    ElasticSearch - Knotensperren konnten nicht abgerufen werden

  7. 7

    Python: Spalten mit demselben Namen zusammenführen, wobei der Mindestwert beibehalten wird

  8. 8

    Elasticsearch startet nicht nach dem Laden in viele Daten

  9. 9

    Ärgerliches Problem mit yaml, das ich nicht lösen kann

  10. 10

    Wie Verwenden von Httpclient mit jedem SSL-Zertifikat, egal wie „schlecht“ es ist

  11. 11

    Wie vergleicht man scala.xml-Knoten richtig?

  12. 12

    ElasticSeach Auto Complete mit dem Vervollständigungsvorschlag, um das vollständige Dokument zurückzugeben

  13. 13

    Wie füge ich eine Spalte in einer Zeile in der Ansible Jinja2-Vorlage mit der for-Schleife hinzu?

  14. 14

    HTTPS-Verbindung mit Moneris-Servern in Curl

  15. 15

    Unity Build-Fehler: Der Name 'EditorUtility' ist im aktuellen Kontext nicht vorhanden

  16. 16

    Bester Crawler, um festzustellen, ob er mit Technologien gebaut wurde?

  17. 17

    So erhalten Sie eine gleichmäßige Höhe für alle Eingabefelder

  18. 18

    Wie kann ich den Kaskadenmodus global einstellen?

  19. 19

    Eclipse Oxygen - Projekte verschwinden

  20. 20

    Wie konvertiere ich einen Vektor von Bytes (u8) in eine Zeichenfolge?

  21. 21

    ElasticSearch BulkShardRequest ist aufgrund von org.elasticsearch.common.util.concurrent.EsThreadPoolExecutor fehlgeschlagen

heißlabel

Archiv