Render component by replacing selector [duplicate]

Question

Suppose I have a component

@Component({
  selector: 'mycomponent',
  template: '...'
})
class MyComponent {
}

Normally it renders template under <mycomponnent></mycomponent>, is there a way I could let this component render but by replacing the selector? I saw https://angular.io/docs/ts/latest/api/core/index/ComponentMetadata-class.html but not sure which configuration could lead to such behavior.

Günter Zöchbauer · Accepted Answer · 2017-02-14 10:27:52Z

0

This is (at least currently) not supported.

What you can do instead is using an attribute selector like

@Component({
  selector: '[mycomponent]',
  template: '...'
})
class MyComponent {
}

then it can be used with any tag like

<li mycomponent></li>

edited Feb 14, 2017 at 10:27

answered Jul 18, 2016 at 14:07

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

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

2 Comments

Shawn Over a year ago

You mean if I use an attribute selector <li mycomponent></li> will be replaced by what's in template? I wonder why would selectors have different behaviors when it comes t rendering.

Günter Zöchbauer Over a year ago

There is nothing being replaced but you (or the user of your component) can freely choose the element name that should become your component.

Collectives™ on Stack Overflow

Render component by replacing selector [duplicate]

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related