Best way to add style to body element with angular

Question

I have this component which does something with dragging. Because of this, I don't want anything on the page to get selected.

Currently I do the following on mousedown

 document.body.style.userSelect = 'none';

and on mouseup

 document.body.style.userSelect = '';

This works, but I'm wondering if angular 4 has a better/neet way to do this?

score 2 · Accepted Answer · edited May 23 '17 at 12:34

Angular doesn't provide anything to manipulate the <body> element, therefore what you're already doing, is the way to go.

What you can do is, to use 'body' as selector of your root component and use

@HostBinding('style.userSelect')
styleUserSelect:String = '';

...

this.styleUserSelect = 'none';

You should be aware that this way all content of <body> will be purged when Angular is initialized.

1 Answers1