Remove component tag in angular 6

Using the attribute selector seems to be the best way of solving this problem. The error you are getting is not due to angular not supporting the square brackets to achieve this, something else must be going wrong in your application. I suggest looking into examples on how to use the attribute selector for components.

Also remember to change

<div> 
    <div>Hello World</div>
</div>

to

<div> 
    <div app-something></div> 
</div> 

for the attribute selector to be effective.


From your component, change selector to div[app-something]

import {Component, OnInit, Input} from '@angular/core';
@Component({
  selector: 'div[app-something]',
  templateUrl: './something.component.html',
  styleUrls: ['./something.component.css']
})
export class SomethingComponent implements OnInit {
  @Input() config: {} = {};
  ....
}

Then you can use that component together with div tag

<div> 
    <div app-something [config]="config"></div> 
</div> 

Tags:

Angular