Img src 三元运算符不显示图像

Question

我正在尝试根据条件对两个图像源使用 angular 中的三元运算符。我没有收到任何错误，但没有显示图像。

<img
          class="rounded-circle z-depth-2 mb-2"
          width="100"
          height="100"
          alt="profile picture"
          [attr.src]="user.user_profile_picture !== null ? 'http://localhost:8000/storage/profile_images/' +
            user.user_profile_picture.image : 'http://localhost:8000/storage/profile-picture.png'"
          data-holder-rendered="true"
        />
      </div>

我是不是犯了一个基本错误？

Answer 1

只尝试 [src]，而不是 [attr.src]。

无论如何，由于您没有从 angular 项目（来自 src/asstes 或类似项目）获取图像，我不确定您是否必须“清理”此 url之前。

尝试并发表评论。

Img src 三元运算符不显示图像

Img src ternary operator not displaying image

image

src

angular