Injected jquery, Winkelcode funktioniert nicht die ganze Zeit

Question

Ich habe Skript in eine Webseite injiziert und es zeigt eine einfache Liste, die ich von der Listenansicht in die Rasteransicht ändern kann. Es sieht wie folgt aus:

Wenn ich Schaltfläche „NEXT“ Ich meine Winkel Zustand ändern und die Ansicht, die Änderungen zu antoher HTML. In diesem anderen HTML-Datei habe ich eine Taste „BACK“, der Zustand zurück zu dieser Liste Vorlage ändert, aber nachdem ich Knopf klicken zurück Ich gehe zur ersten Vorlage und der Blick sieht wie folgt aus:

Darüber hinaus ist die Ansicht Ändern von Schaltflächen von der Liste zu Grid funktioniert nicht mehr ...

Ich weiß nicht, ob ich meinen Code in diese Frage einfügen sollte. Aber ist das das Problem mit eckigen oder vielleicht jqueury? Jede andere Funktion „lassen Sie“ oder „blättern“ funktioniert gut

UPDATE Ich erstelle Google Chrome-Erweiterung und für die Herstellung Liste/Tabellenansichten Ich verwende MixItUp Bibliothek

Dies ist meine Liste Controller die steuert den Blick in den Bildern:

angular.module('app').controller('ListController', ListController); 

ListController.$inject = ['$scope', '$http', '$location', '$state']; 

function ListController($scope, $http, $location, $state) { 

    var $frame = $('#smart'); 
    var $wrap = $frame.parent(); 
    var layout = 'list', 
     $container = $('#ContainerSelect'), 
     $changeLayouttoList = $('#toLongListSelect'), 
     $changeLayoutToGrid = $('#toGridViewSelect'); 

    // Call Sly on frame 
    $frame.sly({ 
     itemNav: 'basic', 
     smart: 1, 
     mouseDragging: 1, 
     touchDragging: 1, 
     releaseSwing: 1, 
     startAt: 1, 
     scrollBar: $wrap.find('.scrollbar'), 
     scrollBy: 1, 
     speed: 300, 
     elasticBounds: 1, 
     easing: 'easeOutExpo', 
     dragHandle: 1, 
     dynamicHandle: 1, 
     clickBar: 1 
    }); 

    $container.mixItUp({ 
     animation: { 
      animateChangeLayout: true, 
      animateResizeTargets: true, 
      effects: 'fade rotateX(-40deg) translateZ(-100px)' 
     }, 
     layout: { 
      containerClass: 'list' 
     } 
    }); 

    // assign function to onclick property of checkbox 
    document.getElementById('checkbox_field').onclick = function() { 
     // access properties using this keyword 
     if (this.checked) { 
      $(".selectProductCB").prop('checked', $(this).prop("checked")); 
      $(".checkbox_txt").text("Uncheck all"); 
     } else { 
      $(".selectProductCB").prop('checked', $(this).prop("checked")); 
      $(".checkbox_txt").text("Check all"); 
     } 
    }; 

    $scope.next = function() { 
     $state.go("selectNotifier", {}, { location: false }); 
    }; 

    $scope.toLongList = function() { 
     layout = 'list'; 
     $container.mixItUp('changeLayout', { 
      containerClass: layout 
     }); 
    }; 

    $scope.toGridView = function() { 
     layout = 'grid'; 
     $container.mixItUp('changeLayout', { 
      containerClass: layout 
     }); 
    }; 
}; 

Dies ist Notifycontroller, welche Taste hat zurück:

angular.module('app').controller('NotifyController', NotifyController); 

NotifyController.$inject = ['$scope', '$http', '$location', '$state']; 

function NotifyController($scope, $http, $location, $state) { 
    $scope.back = function() { 
     $state.go("selectList", {}, { location: false }); 
    }; 
    $scope.watchIt = function() { 
     $state.go("target", {}, { location: false }); 
    } 
}; 

Mit dieser Funktion durch die Zustände Ich springe:

$scope.close = function() { 
    $state.go("selectList", {}, { location: false }); 
}; 

Answer 1

standardmäßig Angular bietet/bleibt Staat. Sie müssen es nicht speichern. Es gibt ein Problem mit Flags/Variablen der Liste/Rasteransicht, wenn Sie auf Zurück klicken.