angularjs页面加载时闪屏问题

由于有时候网速或者其他的原因导致数据刷新很慢,如果使用{{ }}绑定,就会显示出变量原型及{{}},
首先想到的解决办法是:首页用ng-bind绑定数据,其他的可以用{{ }}绑定。
使得之前的 
<div>你的编号是{{index + 1}} </div>
华丽丽的转化为
<div>你的编号是<span ng-bind= "index+1"></span></div>
, 也不知道你看着感觉如何,反正我是看着有点揪心,我好端端的只需要一个元素就能搞定的问题,现在需要两个元素,如果遇到更复杂的问题那就真的头大了,于是我又找到了另一种解决办法:
通过 ng-cloak指令来解决,直接为元素添加此属性,angularjs会将首先将带有 ng-cloak的元素设置为display=none,等到angularjs解析到带有 ng-cloak的标签时,再去掉display=none样式以及 ng-cloak属性。
此时又会发现还有一个问题,当同一个页面有很多ng-cloak时,加载完第一个带有ng-cloak的元素,其他的带有ng-cloak元素的display:none也一起消失了,此时之前的问题又发生了,为了解决这个问题,我们不妨这样写:
<div ng-cloak class= ‘ng-cloak’ >{{index + 1}} </div>
这样就完美的解决了上述问题。
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

_陌默

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值