Angular 2, using body as root selector, instead of my-app Angular 2, using body as root selector, instead of my-app dart dart

Angular 2, using body as root selector, instead of my-app


If you want Angular to control the whole page just use body as selector. See also How do I change the body class via a typescript class (angular2)


If you use 'body' as the selector for your app, it'll work, but there are some problems:

  • The Web Component specification say to use custom elements or custom attributes and it doesn't use official html elements.

  • The official style guide suggests to use 'custom prefix' for your components like 'myComponent'. Also if you want to use some linter like tslint with the 'component-selector-prefix' config in order to check that, it'll throw a warning for use 'body' selector without prefix.

  • If inside the selector (body) there are some elements, they'll be hidden for angular, maybe you'll want to put some 'scripts' inside the body or another component, for example 'webpack' put the scripts in the bottom of the body, and maybe it'll work but not as expected ...

Best.


You can and nothing bad will happen (unless you have two body tags). Still, don't do it because:

Down side

The selector should reflect something unique to your app.