What is the difference between ViewEncapsulation.None and :host, :host /deep/?

Question

I have an Angular 6 custom form control which I have created as a wrapper around another control so that we can apply our own css rules.

I have removed the ViewEncapsulation on this wrapper component so that we can hook on to the css classes generated by the existing form control and overwrite the rules.

encapsulation: ViewEncapsulation.None

A reviewer suggested me to use the combination of :host and :host::ng-deep rather than using ViewEncapsulation.None.

I don't know why that could be better. Can someone explain?

Mohenjodaro

check this blog.angular-university.io/angular-host-context – Essentialism

@Chellappan I will have all the styles under ::ng-deep. Which ultimately will not be scoped or encapsulated (same as ViewEncapsulation.None). So why would one be preferred over the other? – Mohenjodaro

::ng-deep us special selectors that has been taken from shadow DOM style scoping and it is not wildly support by all browser. – Essentialism