为什么在加载AngularJS之前我看到{{...}}？

Question

在我看到范围的真正价值之前，你知道为什么{{ project.title }}。

如何解决？

编辑：<title>{{ pageTitle }}</title>

正在加载页面

页面已完全加载

Answer 1

您对Angular.JS应用的观看次数只是静态HTML。如果你删除了引用Angular.JS的脚本标记，那么你最终会看到一个完全没有被替换的大括号的页面。

当您的浏览器完成加载Angular.JS并加载您的应用程序时，将评估这些大括号中的表达式。这就是为什么您在页面标题中看到{{…}}的短暂时间。

正如其他人所说，ng-cloak directive通常是在应用程序完全加载之前摆脱闪烁的方法。

但由于ng-cloak只是CSS，因此无法应用于页面标题。您需要 ng-bind ，如noted here。

<title ng-bind="pageTitle">Default Title</title>

Answer 2

您应该展示代码，但一般情况下可能是因为您没有使用ng-cloak https://docs.angularjs.org/api/ng/directive/ngCloak 但是，对于标题，您需要使用ng-bind=project.title代替<title>{{ project.title }}</title>

检查How to hide {{title}} in <title> tag while using AngularJS?

Answer 3

要防止出现这种情况，您应该在应用的第一个屏幕上使用ng-bind而不是{{}}。 ng-bind是一个添加到元素属性的指令，因此只有在加载页面时才会显示它。

Answer 4

根据ngBind的描述，我们通常使用{{ expression }}来替换ng-bind。但是在首次加载的情况下，首先加载AngularJS的图像（可能在index.html中），它会显示原始{{}}。在那之后，它转变为你需要的东西。要克服它，您可以使用ngCloak或在第一页中使用ng-bind。

好的，请查看this？