After scouring through the actual notes from the committee meetings on this stuff, it doesn't look like there is an alternative put forward yet. Using the ::ng-deep
syntax ensures that you let Angular take care of breaking out of the style encapsulation (for DOM nodes in child components in your template) that they are doing for your styles (and not using browser native features, making it more future-proof obviously). I think that note is just to let you know that whenever the actual browser mechanism is put in place they plan on implementing it. I personally wouldn't shy away from using it tho.
The only way forward without using that operator in your CSS is to completely opt out of letting Angular manage the style encapsulation for your component by doing this:
import { ViewEncapsulation } from '@angular/core';
@Component({
...
encapsulation: ViewEncapsulation.None
})
If you do this, your styles become global though, so make sure you prepend each style rule with your component to make sure that they don't leak beyond that. For example, if you have a MyCustomComponent
component with a selector of my-custom-component
:
my-custom-component button { ... } /* good */
button { ... } /* bad */
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…