Comment supprimer ngClass tout en élargissant l'écran

Question

J'ajoute une classe à 2 div pour basculer en-tête en utilisant la barre latérale [ngClass] Comment puis-je supprimer les classe quand agrandir l'écran.

Le problème est sur l'élargissement de l'écran, il reste là que parce que la classe n'est pas supprimé. Comment puis-je supprimer la classe?

Lors de l'ajout de la classe [ngClass]="{'menu-push-onscreen': show}" il va basculer et quand j'ouvre l'écran il sera là lui-même comment dois-je supprimer cela?

show: boolean = false; 

onToggleHeader(){ 
    this.show=!this.show; 

}

Answer 1

Il suffit de définir la [ngClass] se liant à null. Voici un exemple:

Dans votre component.html:

<div [ngClass]="myClass"></div> 

Dans votre classe de composant:

... 
// Declare varibale 
myClass:string; 

// Set some variable to true if the screen widening 
if(isScreenWidening){ 
    this.myClass = null; 
} 
... 

Answer 2

@media screen and (max-width: 600px) { // this is for screen width less than equal to 600px 

    .yourClass{ 
    // remove all the properties you might have set 
    } 
} 

Si vous avez besoin d'ajouter d'autres requêtes de médias selon la taille écran changement la largeur max ou min.