Andrew Howard
Andrew Howard

Reputation: 3082

Prevent outer component mark up to be rendered

I am importing a component into my page:

<div>
<p>Here is my component:</p>
<my-component></my-component>
</div>

How can I prevent the physical HTML of <my-component></my-component> from being rendered in the markup, and just use the html there has been declared within the my-component template?

Right now I get:

    <div>
    <p>Here is my component:</p>
    <my-component><div>This is the inner html</div></my-component>
    </div>

Whereas I want:

        <div>
        <p>Here is my component:</p>
        <div>This is the inner html</div>
        </div>

Upvotes: 1

Views: 104

Answers (1)

ABOS
ABOS

Reputation: 3823

In component definition, you can set selector: '[my-component]', and treat it like directive, i.e.

<div my-component>This is the inner html</div>

then the component tag won't show up.

Upvotes: 3

Related Questions