Multiple components match node with tagname app-lobby

Question

the code was running fine on angular version 8.3.4 but when i updated it to the latest version of angular ( 9 ) i got the following error

following is t

Answer 1

This error actually has less to do with the tagname app-lobby. I encountered this error when I applied multiple component selector on a html tag.

For example: Component 1

@Component({
    ...
    selector: '[my-tooltip]',
    ...
})

Component 2

@Component({
    ...
    selector: '[my-button]',
    ...
})

Notice that both of them are angular component yet having a selector like attribute directive.

When you apply both of them on the same tag like below:

Hover me

Then angular complains about applying 2 components on a single tag. In this case it will complain about button tag, like: Error: Multiple components match node with tagname button

The solution would be not to use multiple component selector on a single element.