1

When reloading a page of my angularJS app, it will show "School:", very ugly. I do not want to show this incomplete information during the page loading. 

<title>School: {{query}}</title>

How to hide it while the page is loading?

Improve this question
3
  • you can use ng-cloak directive for this . Commented Apr 19, 2016 at 10:17
  • Put 'School: ' within the {{query}} binding. Commented Apr 19, 2016 at 10:17
  • @shammelburg it works, thanks Commented Apr 19, 2016 at 10:20

2 Answers 2

Reset to default
2

Wherever you want to achieve this behavior, just add ng-cloak to that html tag. This will prevent the UI from showing the content until the expression is evaluated.

<title ng-cloak>School: {{query}}</title>

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1

Instead of using double curlies, a better solution would be to use the ngBind or ngBindTemplate directives, which are invisible to the user while the page is loading:

<title ng-bind-template="School: {{query}}">Querying</title>
Improve this answer

Comments