img src gives Template parse errors in angular2

Question

My code is as shown below:

test.html

<div class="q-img-container">
    <img id="q-order-img" src="../img/ic_truck.png" alt=""></img>
</div>

But it gives me following error:

"Unhandled Promise rejection:"
"Template parse errors:
Void elements do not have end tags "img" ("iv class="q-img-container">
                <img id="q-order-img" src="../img/ic_truck.png" alt="">[ERROR ->]</img>
            </div>

My directory structure is as follows:

---app
------img
----------ic_truck.png
------template
----------test.html

What am I missing here?

Yes, it worked. The above line in question worked fine in angular 1 , why it is rejected in angular2 — Mrugesh
– Mrugesh, Commented Sep 25, 2017 at 17:40

Yogesh · Accepted Answer · 2017-09-25 18:08:54Z

6

img tag is a void element. Such elements cannot have any content and are forbidden to be closed (W3C recommendation).

As the error message says, remove the end tag </img>.

Just use following

<img id="q-order-img" src="../img/ic_truck.png" alt="">

Please refer to this answer.

edited Sep 25, 2017 at 18:08

answered Sep 25, 2017 at 17:36

Yogesh

7581 gold badge6 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

img src gives Template parse errors in angular2

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related