Três maneiras de usar encapsulamento angular

Pequeno · Publicado em 12/05/2020 11:02:24

De acordo com a versão mais recente da documentação oficial do site, a encapsulação agora possui 4 valores de atributo:

import { Component, OnInit, ViewEncapsulation } de '@angular/core';

Padrão emulado

Os estilos são escopados e o componente pai não afeta o estilo do componente filho (o mecanismo de encapsulamento de estilos fornecido pelo Angular)
Essa seleção é o padrão, ou seja, é o valor sem necessidade de configurar manualmente o encapsulamento. Sob esse item de configuração, cada componente tem um escopo, e o componente pai não pode afetar o componente próprio. Se você precisar que o estilo do componente pai, substitua o estilo do componente filho nesse item de configuração. Você pode usar ::ng-deep, mas o site oficial não recomenda o uso de ::ng-deep

Nenhum

Nenhum pacote é fornecido, e o estilo é aplicado diretamente a todo o documento. (Afeta seus próprios componentes filhos para baixo, para cima afeta seus próprios componentes pais)

Nativo e Sombra

Usando o estilo nativo de encapsulamento de sombra, a raiz de sombra pode ser vista na estrutura do DOM, e podemos ver muito bem como o estilo é escrito nela, válido apenas para componentes na faixa de raiz de sombra.

Pequeno · Publicado em 26/11/2021 17:07:13

O login está visível.

[Angular] Três maneiras de usar encapsulamento angular

Posts Relacionados

Seções visualizadas