El tutorial o código que verás en este artículo es la solución más sencilla y efectiva que encontramos a esta duda o dilema.
Solución:
Si intenta aplicar estilo dentro de los componentes secundarios, no funcionará. Debe usar ng-deep en scss. Más información sobre estilismo.
::ng-deep .className
En el componente, tenga cuidado con lo que se da como StyleUrl:
@Component(
selector: 'app-something',
templateUrl: './something.component.html',
styleUrls: ['./something.component.scss']
)
Tal vez su sintaxis es mala, o se está refiriendo a un simple something.component.**css** en vez de .scss expediente.
Para mí, necesitaba establecer ViewEncapsulation.None para mi styleURLs para tomar efecto:
import Component, OnInit, ViewEncapsulation from '@angular/core';
@Component(
selector: 'app-testing',
templateUrl: './testing.component.html',
styleUrls: ['./testing.component.scss'],
encapsulation: ViewEncapsulation.None,
)
export class TestingComponent implements OnInit
constructor()
ngOnInit()
No estoy seguro de por qué esto es necesario. Se necesita en Angular 8 al menos, pero no en Angular 9 afortunadamente.
Tienes la opción de añadir valor a nuestro contenido tributando tu experiencia en las aclaraciones.