Remove tag from angular component 6

Asked

Viewed 93 times

1

Is there any way to render only the content of the component, hiding the tags?

How it works:

<ul>
    <li-component> </li-component>
</ul>

Renderiza:

<ul>
    <li-component>
        <li>
            Frase
        </li>
    </li-component>
</ul>

He keeps the tag <li-component>

Desired result:

<ul>
    <li>
        Frase
    </li>
</ul>
javascript html angular

  • Might explain why you want this?

1 answer

0

Welcome to Glauco! :D

Dude it’s pretty simple you can change the component selector "although not recommended" in the Style Guide

import { Component } from '@angular/core';

@Component({
  selector: 'li[my-component]',
  templateUrl: './my.component.html'
})
export class MyComponent {

  constructor() { }

}

You can basically use an attribute selector despite having other selectors, it would look like this:

<ul>
    <li my-component> </li>
</ul>

Render like this:

<ul>
    <li my-component>
        Frase
    </li>
</ul>

  • It didn’t work here :( It still renders the tag li, and another tag li inside

  • Put your example component here! .ts .html and .css

Browser other questions tagged javascript html angular

You are not signed in. Login or sign up in order to post.