Only the first local image will render on a table

What happened?

When I display local images in Dataview, only the first image will appear. The subsequent images don’t have an img tag within them and don’t display. If I change the sort on the table to change the order in which items appear, the one that was displaying stops working and the one that wasn’t displaying begins to display.

1. Image A (displays)
2. Image B (doesn’t display)

change sort from asc to desc:

1. Image B (displays)
2. Image A (doesn’t display)

If I group my results, the first entry for each group will display.

Console is empty with no errors.

For testing purposes I created two files that only contain front matter:

---
image: 1984%20The%20Graphic%20Novel%20(2021).jpg
---

and

---
image: 4%20Kids%20Walk%20Into%20A%20Bank%20(2016).jpg
---

DQL

 dv.table(["Cover", "Name"],
 dv.pages('"Notes/Comics"')
    .where(f => f.image)
    .sort(f => f.image, 'asc')
    .map(k => [`![](${k.image})`, k.file.link]))

 dv.table(["Cover", "Name"],
 dv.pages('"Notes/Comics"')
    .where(f => f.image)
    .sort(f => f.image, 'desc')
    .map(k => [`![](${k.image})`, k.file.link]))

JS

No response

Dataview Version

0.4.26

Obsidian Version

0.13.23

OS

Windows

[chelming]

Figured out the img src on mobile. Had to use <img src="${app.vault.adapter.getResourcePath("Media/Comics/"+k.cover)}"> to get it to render properly.

[XSAM]

Thank you @chelming!

I now use <img src="${app.vault.adapter.getResourcePath(p.avatar.path)}">. avatar is a field, the value could be ![[img.png]].

It works on macOS and iOS.