Muchas veces, las aplicaciones AngularJS mostrarían el parpadeo del documento HTML cuando se inicia la aplicación principal. Esto mostrará el código AngularJS durante bastante tiempo. El uso de la directiva ng-cloak es evitar que los elementos en AngularJS sean presentados brevemente por el navegador web en un estado inacabado, incompleto, sin compilar y sin formato, mientras que el programa fundamental aún está a punto de cargarse. Esto es básicamente para detener el impacto de parpadeo no deseado que se muestra muchas veces al principio cuando se carga el programa. La pieza de datos sin terminar simplemente se mantiene en espera y espera los datos entrantes.
Sintaxis:
<element ng-cloak> {{the piece of code}} </element>
Ejemplo: Este ejemplo muestra el uso de la directiva ng-cloak.
<!DOCTYPE html>
<html>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js">
</script>
<head>
<title>AngularJS | ng-cloak Directive</title>
</head>
<div ng-app="">
<body style = "text-align:center">
<h2 style = "color:green">GeeksForGeeks</h2>
<h2 style = "color:purple">AngularJS ng-cloak</h2>
<p ng-cloak>{{ 10 + 10 }}</p>
</body>
</div>
</html>
Salida:
Cuando cargamos el código:
Este ejemplo ciertamente se cargaría sin parpadear incluso cuando no incluyéramos la directiva ng-cloak. Pero esto nos dice cómo incluir la directiva ng-cloak en un elemento HTML.
Publicación traducida automáticamente
Artículo escrito por SohomPramanick y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA