angulaire.js - Un piège d'Angularjs

Question

Scénario 1 :

 var p_NormalStatus = document.getElementById("NormalStatus");//p1
 var p_LockStatus = document.getElementById("LockStatus");//p2

 function getData(){  
    p_NormalStatus.style.display = "none";//1
    p_LockStatus.style.display = "block";//2
 }

Lorsque la page est chargée pour la première fois, il n'y a aucun problème pour exécuter la fonction getData
Après le retour, les codes 1 et 2 sont exécutés, mais les deux p sont affichés, ce qui signifie que le code ne fonctionne pas ;

Scénario 2 :

 function getData(){  
    document.getElementById("NormalStatus").style.display = "none";//1
    document.getElementById("LockStatus").style.display = "block";//2
 }

C'est bon !

Pourriez-vous s'il vous plaît expliquer pourquoi cela se produit ? !

Answer 1

Lorsque les codes 1 et 2 du scénario 1 sont exécutés, la page n'a pas chargé les deux DOM, puis a mis en cache deux objets DOM vides. Naturellement, il n'y aura aucune valeur lors de l'exécution de getData. De plus, votre problème n'a rien à voir. avec angulairejs. Cela n'a pas d'importance, dois-je toujours écrire comme vous le faites lorsque vous utilisez ng ?

Answer 2

Tout d'abord, lorsque vous rencontrez un problème, interrompez et vérifiez quelle en est la cause
Ensuite, utilisez des classes pour changer le style au lieu de redessiner par intermittence
Enfin, le problème spécifique et l'environnement spécifique incluent L'exécution environnement de votre fonction de méthode de chargement