我是AngularJS的新手,并尝试解决在ng-if条件得到评估之前显示某些HTML代码的问题.我正在许多其他堆栈中提到的流式URL中提到ng-cloak,但它仍然不适用于我.我正在尝试加载默认图像,如果URL上的实际图像为空白,并且当页面加载时,即使实际URL存在,它首先使用默认图像闪烁,然后加载实际图像,因为ng-cloak无法正常工作.
请帮忙.
我有下面的代码和CSS等
的index.html
<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8">
<base href="/">
<title>Some App</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-resource.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-route.min.js"></script>
<script src="https://code.angularjs.org/1.4.7/angular-sanitize.min.js"></script>
<style type="text/css">
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}
</style>
</head>
<body ng-app="app">
some code here
<div ng-view></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
other.html
<div class="content">
<div style="width: 100px; height: 40px;">
<div ng-if="image.small">
<img src="{image.small}}">
</div>
<div ng-if="!image.small" ng-cloak>
<img src="image/default.png">
</div>
</div>
Run Code Online (Sandbox Code Playgroud) 在处理许多滚动图像时,您必须避免在略读时加载的问题,同时用户正在快速滚动.最简单且通常最好的解决方案非常简单:
在做任何事情之前,只是引入一个小延迟(比如说.350).
如果图像已经在缓存中,只需加载它.否则只需稍等一下 - 然后完全正常进行.
凭借壮观的毕加索,令人沮丧的是,看起来有一个叉子实际上就是这样,它有一个"withDelay"选项**(见https://github.com/square/picasso/issues/248)
我害怕叉子.
但是有可能在毕加索这样做,也许使用自定义的"目标"?所以,
我普通的Picasso调用(在getView的末尾......)
Picasso.
with(State.mainContext).
load(imageFile.getUrl()).
placeholder(R.drawable.default).
noFade().
into(v.im);
Run Code Online (Sandbox Code Playgroud)
而我想,我想要的东西,像这样.......
Picasso.
with(State.mainContext).
load(imageFile.getUrl()).
placeholder(R.drawable.default).
noFade().
into(new Target()
{
simply wait .350 before proceeding completely normally...
});
Run Code Online (Sandbox Code Playgroud)
我不能这样做,任何人都可以做到吗?