Javascript 当图像仍在从服务器加载时，如何获取要加载的占位符图像

我正在用Angular 4/Ionic 3构建一个应用程序，它加载用户从服务器上传的图像。我目前正在使用下面的代码，但它不起作用：

<img src="{{user.image}} || assets/images/profileimage.png" />

<img [src]="user.image || './assets/images/profileimage.png'" />

---

我不确定我做错了什么。我想在从服务器加载主图像之前，它会显示占位符图像。相反，在加载主图像之前，它仍然是空白的。是否有一些特定于Angular的东西我应该使用？

最好使用这个延迟加载插件。真是太棒了

安装：

npm安装ng2 lazyload映像--保存

在app.module.ts中导入延迟加载：

Import{LazyLoadImageModule}来自“ng2 lazyload image”

 imports: [ BrowserModule, LazyLoadImageModule ],

在ur html中，将ur img标记替换为以下内容：

在ur组件中创建此vaiables：

defaultImage = 'https://www.placecage.com/1000/1000';
image = 'https://images.unsplash.com/photo-1443890923422-7819ed4101c0?fm=jpg';
offset = 100;

有关更多信息，请参阅此

如果你在这方面需要帮助，请告诉我

希望这对您有所帮助。
您需要在此处以字符串文本形式提供相对路径

<img src="{{user.image}} || ./assets/images/profileimage.png" />



或者尝试：



据我所知，所有现代浏览器都应该支持
HTMLImageElement.complete
，这样您就可以使用


检查一下，我不知道是角度的还是离子的。但我认为你的img src是错误的，应该是这样的，你需要设置相对路径
/asstes/images/profileimage.png“
@karthigh
ng src
代表angularjs（v1）@suraj好的。就像我说的，不是一个有棱角的家伙，而是src=“{user.image}}| assets/images/profileimage.png“感觉不对，我想您需要在第一个
img
或
src
中为字符串文本路径加单引号。。打字错误？@suraj谢谢你的提示-我通过删除
[]
修复了它，谢谢你的反馈@Roopendra..我编辑了我的answer@Roopendra你可以说这个答案现在很有用；）是的，现在好多了：）谢谢。
isImgLoaded:bool = false;