Angular 1.5 + jquery scroll animation

Question

Ich habe kleine eckige SPA mit paar Routen. Ich wollte nur auf #/welcome/page einen Fade-Effekt haben. Meine jquery funktioniert ok, aber das Problem ist - es läuft auf allen Seiten und in anderen Seiten Elemente, was animiert werden soll existiert einfach nicht und das ist der Grund, ich habe Fehler auf meiner Konsole beim Benutzer scroll ... Ich habe versucht Skript nur ausführen, wenn Route geändert und dann check ob location ist/#/welcome aber es läuft immer wenn auch nicht ... Ich habe versucht Code nur auf den Controller zu setzen, der es auf Abschnitt mit animierenden Elementen beschränken sollte, aber es lief auch auf anderen Seiten ... Ich bin bitte verwirrt Hilfe

Answer 1

Ihre App ist SPA, wenn Sie also ein Ereignis zum Fenster hinzufügen, bleibt es so lange erhalten, bis Sie die Browser-Registerkarte schließen.
Sie haben die Veranstaltung entfernen auf Begrüßungsseite zu zerstören, so entfernen Sie alle diese Codes und fügen Sie diese an Ihre Begrüßungsseite Controller:

//in welcome page controller 

var onScroll = function(){ 
    var queries = [ 
     {elm: '.tablet', effect: 'fadeInRight'}, 
     {elm: '.padding', effect: 'fadeInLeft'} 
    ]; 

    for (var i=0, j=queries.length; i<j; i++) { 
     var position = $(document).scrollTop() + $(window).innerHeight() ; 
     var elem = $(queries[i].elm).offset().top + ($(queries[i].elm).innerHeight())/2; 
     if (elem <= position) { 
      $(queries[i].elm).addClass(queries[i].effect); 
     } 
     else { 
      $(queries[i].elm).removeClass(queries[i].effect); 
     } 
    } 
} 

$(window).on('scroll' , onScroll); 

$scope.$on('$destroy', function() { 
    $(window).off('scroll' , onScroll); 
});