I am new in AngularJS.
I am fetching data from the Rest API and displaying it on the page.
My Supposed code is giving below.
$http.get(local_url+'/data').
then(function(response) {
$scope.data = response.data.client_data;
});
Now when suppose I write.
<p>{{ data.name }}</p>
So when i come on page, it is showing above {{ data.name }} code after sometime it is showing any name.
=============================================================
Solution.
I used in body tag like that. <body ng-cloak> It will work.
thanks.
What you could do is define the $scope.data before the $http as an empty string
$scope.data = "";
You also could use the build in ngCloak directive. This will prevent AngularJS from displaying the $scope in its raw form.
You can find more info about it inside the AngularJS docs here
Another option would be to use the ng-if or ng-show expression, to check whether a value isset or not before rendering the element.
<p ng-if="data.name">{{data.name}}</p>
or
<p ng-show="data.name">{{data.name}}</p>
Where ng-if clones the element and appends it to the document when the expression is true and ng-show just toggles a display: none; or display: block; state on the element.
Helpfull Links:
ng-if documentation
ng-show documentation
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With