I am using Angular6.
I have a pre tag with email text. Within this email text are tags like [cid:image001.jpg] which represent an image, using image001.jpg, I can retrieve that specific image from the back-end.
The problem is that I don't know how I can insert a new HTML element from the Typescript file into the pre tag, if this is even possible.
I have tried using a replace() method and replacing the '[cid:image001.jpg]' with '<img ...>' but it (understandably) gets interpreted as a string.
Help would be much appreciated.
Edit:
the positioning of the images is important, the <img> tag should appear where the [cid:image001.jpg] is, for example.
Example email:
Greetings,
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vehicula egestas elit viverra auctor. [cid:image001.jpg] Morbi at nisi vel lorem porta pellentesque ut non urna.
Integer tempor tincidunt viverra. Vivamus ullamcorper et risus ac. [cid:image002.jpg]
Best regards...
答案 0 :(得分：0)
Can you try to pass the image in argument like this:
<img [cid]="pictureUrl">
答案 1 :(得分：0)
I fixed this by doing the following, I changed:
<pre> {{emailText}} </pre>
To:
<pre innerHTML="safeHTML(emailText)"> </pre>
Where safeHTML() cleans the text so that scripting is not possible, this is important because it would be very unsafe otherwise.