html5 Audio funktioniert nicht richtig mit eckigen | ionische

Problem: AngularJS spielt 2 mal das gleiche Lied zugleich mit einigen Sekunden Verzögerung zwischen ihnen, erste Mal, dass ich die Musik nenne ich tun es wie folgt aus:html5 Audio funktioniert nicht richtig mit eckigen | ionische

//preset sound 
    var sound = true; 
    var sound = localStorage.sound; 
    var sound = eval(sound); 

    $scope.icon = "ion-volume-mute"; 
    var audio = new Audio('sound/song.mp3'); 
    audio.loop = true; 

     //change icon & sound based on localstorage variables 
     if (sound == true){ 
      window.localStorage.setItem("sound", true); 
      audio.play(); 
      $scope.icon = "ion-volume-mute"; 
      console.log(sound); 
     } 
     else{ 
      window.localStorage.setItem("sound", false); 
      console.log("ëlse " + sound); 
      audio.pause(); 
      $scope.icon = "ion-volume-high"; 
     } 
    //let the user toggle the sound (MUTE | Play) 
    $scope.soundControl = function() { 

    if (sound == false){ 
     sound = true; 
     audio.play(); 
     $scope.icon = "ion-volume-mute"; 
     window.localStorage.setItem("sound", true); 
     console.log(localStorage.sound); 
    } 
    else{ 
     sound = false; 
     audio.pause(); 
     $scope.icon = "ion-volume-high"; 
     window.localStorage.setItem("sound", false); 
     console.log(localStorage.sound); 
    } 
    }

dies setzt auch eine Schaltfläche für Benutzer, bei denen ein Stumm- oder Wiedergabesymbol angezeigt wird (wird auch im lokalen Speicher für die nächste Verwendung gespeichert)

auf einer anderen Seite möchte ich dem Benutzer eine andere Möglichkeit geben, die Musik weiter zu verwenden oder sie zu stoppen (wird auf mehreren Seiten wiedergegeben).

Ich benutze die gleiche Art von Code für sie

//sound 
    var sound = true; 
    var sound = localStorage.sound; 
    var sound = eval(sound); 

    $scope.icon = "ion-volume-mute"; 
    var audio = new Audio('sound/song.mp3'); 
    audio.loop = true; 

     //audio switch (PLAY | PAUZE) 
    $scope.soundControl = function() { 

    if (sound == false){ 
     sound = true; 
     audio.play(); 
     $scope.icon = "ion-volume-mute"; 
     window.localStorage.setItem("sound", true); 
     console.log(localStorage.sound); 
    } 
    else{ 
     sound = false; 
     audio.pause(); 
     $scope.icon = "ion-volume-high"; 
     window.localStorage.setItem("sound", false); 
     console.log(localStorage.sound); 
    } 
    }

Merkwürdige ist nun, wenn Sie die Taste verwenden, beginnt die Musik 2 mal mit einer gewissen Verzögerung spielen dazwischen, anstatt sie zu Muting.

Ich habe versucht, den neuen Audioteil zu entfernen, stürzt dann aber die Seite ab, weil keine Audiodatei gefunden wurde.

Ideal würde es einfach aufhören oder starten Sie die Wiedergabe der vorhandenen Musikdatei. (Dies über zwei verschiedene Controller ist)

Quelle

2016-08-09 Jurjen Folkertsma

Wenn Sie dies tun: 'var sound = true; var sound = localStorage.sound; var sound = eval (Sound); 'ordnen Sie nicht einfach den Wert einer einzelnen Variablen zu? In einem Fall ist es also "wahr", aber plötzlich wird es als Sound gespeichert, aber nicht als wahr, dann wird es schließlich ausgewertet, aber es wird nicht mehr als Sound gespeichert, noch war es jemals wahr. – zer00ne

Ich habe versucht, ein if/else wie folgt zu machen if (localStorage.sound === null) { var sound = true; } else { var sound = localStorage.sound; var sound = eval (Ton); } aber stil auf der anderen Seite beginnt es ein neues Lied, anstatt mit dem vom ersten Controller zu arbeiten (löschte auch das sound = true; Teil vom zweiten Controller vonc) –

der erste spielt weiter auf Seiten, aber die der zweite scheint nicht zu erkennen, dass es derselbe ist –

Durch die Verwendung einer Steuerung, das ist um meine Sicht kann ich meine Sachen in-1-Controller setzen und das scheint wie ein Zauber wie diese

<body ng-app="starter"> 
    <div ng-controller="complete-app"> 
     <ion-nav-view></ion-nav-view> 
    </div> 
    </body>

Und mit dem Controller zu arbeiten

app.controller("complete-app", function($scope) { 
    $scope.icon = "ion-volume-mute"; 
    var audio = new Audio('sound/song.mp3'); 
    audio.loop = true; 

    if (localStorage.sound === null) 
    { 
    var sound = true; 
    } 
    else { 
    var sound = localStorage.sound; 
    var sound = eval(sound); 
    } 

    //change icon & sound based on localstorage variables 
    if (sound === true){ 
     window.localStorage.setItem("sound", true); 
     console.log("sound " + sound); 
     audio.play(); 
     $scope.icon = "ion-volume-mute"; 
     console.log(sound); 
    } 
    else{ 
     window.localStorage.setItem("sound", false); 
     console.log("sound " + sound); 
     audio.pause(); 
     $scope.icon = "ion-volume-high"; 
    } 

    //let the user toggle the sound (MUTE | Play) 
    $scope.soundControl = function() { 

    if (sound === false){ 
     sound = true; 
     audio.play(); 
     $scope.icon = "ion-volume-mute"; 
     window.localStorage.setItem("sound", true); 
     console.log(localStorage.sound); 
    } 
    else{ 
     sound = false; 
     audio.pause(); 
     $scope.icon = "ion-volume-high"; 
     window.localStorage.setItem("sound", false); 
     console.log(localStorage.sound); 
    } 
    } 
});

Quelle

2016-08-10 17:56:48

html5 Audio funktioniert nicht richtig mit eckigen | ionische

Antwort

Verwandte Themen