Convert the following line from jquery to angular (addClass and removeClass)

1

I need to convert the following lines (which when clicked check which is the active class and change according to which is ..) Thank you very much already.

$(".x-navigation-minimize").click(function() {
  if ($(".page-sidebar .x-navigation").hasClass("x-navigation-minimized")) {
    $(".page-container").removeClass("page-navigation-toggled");
    $(".page-container").removeClass("page-container-wide");
    $(".page-sidebar .x-navigation").removeClass("x-navigation-minimized");
    $(".x-navigation-minimize").find(".fa").removeClass("fa-indent").addClass("fa-dedent");
  } else {
    $(".page-container").addClass("page-navigation-toggled");
    $(".page-container").addClass("page-container-wide");
    $(".page-sidebar .x-navigation").addClass("x-navigation-minimized");
    $(".x-navigation-minimize").find(".fa").removeClass("fa-dedent").addClass("fa-indent");
  }
});
    
asked by Alexis Granja 28.04.2017 в 22:03
source

2 answers

1

The angular library has jqlite, you can access it with the sentence angular.element I leave you a more complete example.

angular.element('#div1').addClass("alpha");
    
answered by 29.04.2017 / 03:18
source
0

Fixed with toggleClass

this.toggleBar = function() {
  var container = angular.element(document.querySelector('.page-container'));
  var bar = angular.element(document.querySelector('.page-sidebar .x-navigation'));
  container.toggleClass('page-navigation-toggled');
  container.toggleClass('page-container-wide');
  bar.toggleClass('x-navigation-minimized');
}
    
answered by 29.04.2017 в 02:13