DOM-Element mit AngularJS entfernen

Question

Ich versuche eine Navbar basierend auf dem aktuellen Pfad zu entfernen.

Dies ist, was ich bisher:

angular.module('myModule') 
    .controller('MainController', function ($location, $document) { 
    if ($location.path().indexOf('resetpass') > -1) { 
     var navbar = angular.element($document.querySelector(".top-navbar")); 
     navbar.remove(); 
    } 
    }); 

Mit diesem Ansatz die Konsole sagt:

angular.js:14110 TypeError: $document.querySelector is not a function 
at new <anonymous> (main.controller.js:6) 
at Object.invoke (angular.js:4762) 
at $controllerInit (angular.js:10518) 
at nodeLinkFn (angular.js:9416) 
at compositeLinkFn (angular.js:8757) 
at compositeLinkFn (angular.js:8760) 
at publicLinkFn (angular.js:8637) 
at angular.js:1808 
at Scope.$eval (angular.js:17913) 
at Scope.$apply (angular.js:18013) 

Was mache ich falsch?

Answer 1

Verwendung ngIf in Ihrem DOM Element und etwas tun, wie folgt aus:

Vorlage:

<element ng-if="hideElemet"></element> 

Controller:

if ($location.path().indexOf('resetpass') > -1) { 
     $scope.hideElement = false 
} 

ngIf wird das Element aus dem DOM

Answer 2

entfernen Versuchen Sie es mit document , nicht $document.

var navbar = angular.element(document.querySelector(".top-navbar")).remove(); 

Answer 3

ich wie Ze Rubeus Weise fühlen sich die navbar des Versteckens macht mehr Sinn, aber wenn Sie mit den Vorgang fortsetzen möchten, was haben Sie diese funktionieren sollte:

angular.module('myModule') 
.controller('MainController', function ($location, $document) { 
    if ($location.path().indexOf('resetpass') > -1) { 
    var navbar = angular.element($document[0].querySelector(".top-navbar")); 
    navbar[0].remove(); 
    } 
}); 

Angular Wraps alle es DOM-Elemente ist, Um direkt auf das Element zugreifen zu können, müssen Sie das erste Element greifen.