0

I am new to angular js and I am trying to fix the issue that some of the html code displays before it gets evaluated. It is first showing the expression and then the value. I have added ng-cloak in the body, but it is not working. I, then, tried to add it to the html top section, but no luck. Checked the below link:

ng-cloak not working when page load

but I am not able to find the correct solution for this.

HTML:

<body ng-app="rootApp" ng-cloak>
<div class="pName" ng-init="getDetails()">
                        <strong> {{desc}} <br>
                        {{shortdesc}} {{name}}</strong>
                    </div>
</body>

controller code:

$scope.getDetails = function () {
 // this is the  service call
        service.getName({ id: 3 }).$promise.then(function (data) {
            if (data.length > 0) {
                $scope.desc = data[0].desc;
                $scope.shortdesc = data[0].shortdesc;
                $scope.name = data[0].name;
            }

        });

    }
Community
  • 1
  • 1
SivaRajini
  • 7,225
  • 21
  • 81
  • 128

2 Answers2

2

when we use ng-cloak we put ng-Cloak in css please follow url https://docs.angularjs.org/api/ng/directive/ngCloak

Viijay ijardar
  • 1,075
  • 1
  • 10
  • 19
1

Include this CSS

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak
{
  display: none !important;
}

Even you need to wite ng-cloak inside <strong>

<strong ng-cloak>
Kumar
  • 270
  • 1
  • 4
  • 17