CODEWITHSUNDEEP
angulartemplatescomponentsselector
Vladimir Despotovic
Vladimir Despotovic

Reputation: 3497

In Angular, how to remove the selector tag from around the component's template?

In Angular, how to remove the selector tag from around the component's template? It is making problems for browser to display the <td> fields within the component. I have many instances of <tr> and each one has the first <td> styled differently:

<tr>
  <td>1.1</td><td>1.2</td>
        <app-summary-data-row [data]="data[1]">
        </app-summary-data-row>
    </tr>
    <tr>
            <td colspan=2>2</td>
            <app-summary-data-row [data]="data[2]">
            </app-summary-data-row>
        </tr>

But, the majority set of <td> follows the same pattern, so I want to make the into the same template. The trouble is the angular's tags, that distort the construct of the table.

Upvotes: 0

Views: 840

Answers (1)

Rohit Sharma
Rohit Sharma

Reputation: 3334

You can use the attribute selector instead in @component decorator:-

@Component({
  selector: '[component-name]'
  ...
})

And then use it as:-

<div component-name>
  ...
</div>

As per the documentation:-

You can Specify a CSS selector that identifies this directive within a template. Supported selectors include element, [attribute], .class, and :not().

Does not support parent-child relationship selectors.

Upvotes: 1

Related Questions