De alguna manera, ng-cloak en AngularJS no funciona. Quiero ocultar {{ }} mientras carga la página. Porque se ve horrible.
<!DOCTYPE html> <html lang="en" ng-app> <head> <meta charset="UTF-8"> <title>Angular Sample</title> </head> <body ng-model="isShow" ng-init="isShow=true"> <p ng-show="isShow"><span ng-cloak>{{ isShow }}</span></p> <p ng-show="!isShow"><span ng-cloak>{{ isShow }}</span></p> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> </body> </html>Agrega este css desde aquí
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { display: none !important; }y use el nombre de la clase o el atributo en su div principal o en cualquier lugar donde haya definido su aplicación.
p.ej:
<div ng-app="Random" class="ng-cloak"> </div>Para obtener el mejor resultado, el script
angular.jsdebe cargarse en la sección principal del documento html; alternativamente, la regla css anterior debe incluirse en la hoja de estilo externa de la aplicación.
Tienes que especificar estas reglas en tu CSS:
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { display: none !important; }