more on ViewEncapsulation

Following up on what I elude to here, this has this example:

@Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css'],
   encapsulation: ViewEncapsulation.None
})

 
 

This should allow one to have a cascading effect from outer component to inner component that one normally associates with ::ng-deep without ::ng-deep assuming you have ViewEncapsulation.None at the inner component. You will need an import like so:

import { ViewEncapsulation } from '@angular/core';

 
 

If you don't need a cascading effect, if you just need to use the outer component's stylesheet at the inner component, you could always just import the outer component's stylesheet at styleUrls as seen above alongside ./app.component.css as that would work too. Don't want to import all of the styles? Break the outer component's stylesheet in two!