각도 2 기본보기 캡슐화

ViewEncapsulation.Emulated, ViewEncapsulation.Native ad ViewEncapsulation.None의 차이점을 설명하는 이미 an answered question이 있습니다.각도 2 기본보기 캡슐화

기본적으로 섀도우 DOM과 ViewEncapsulation.Native을 기본적으로 지원하는 Chromium 버전과 번들로 제공되는 전자 애플리케이션이 있다고 가정 해 보겠습니다. 이 경우 어떻게 에뮬레이션 오버 헤드를 피하기 위해 기본 캡슐화의 이점을 얻을 수 있습니까?

또 다른 가능한 경우는 ViewEncapsulation.Emulated으로 인해 도우미 속성과 네임 스페이스가 적용된 CSS 클래스로 크게 어수선하게 보이는 각도 2 응용 프로그램의 디버깅보기입니다.

encapsulation을 지정하지 않은 모든 구성 요소에 대해 기본 캡슐화를 전체적으로 ViewEncapsulation.Native으로 변경할 수 있습니까?

ViewEncapsulation.Native의 다른 실용적인 기기는 무엇입니까?

출처

2016-07-07 estus

https://github.com/angular/angular/pull/7883에 따르면이 아직 불구하고 그것을 자신을 시도하지 않은

import {CompilerConfig} from '@angular/compiler'; 

bootstrap(AppComponent, [{ 
    provide: CompilerConfig, 
    useValue: new CompilerConfig({defaultEncapsulation: ViewEncapsulation.Native}) 
}])

작동합니다.

ViewEncapsulation.Native은 대부분 Chrome을 대상으로하는 경우에 가장 유용 할 것입니다. 다른 브라우저가 그림자 DOM 지원을 릴리스하기까지는 아직 상당한 시간이 걸릴 것으로 보인다.

주요 이점은 Angular2가 각 구성 요소에 특성을 추가 할 필요가없고 더 이상 모든 구성 요소 스타일을 <head>에 추가 할 필요가 없다는 것입니다.

오프라인 템플릿 컴파일러를 사용할 때 대부분의 경우 성능은 Emulated과 함께 큰 문제가되지 않습니다.

출처

2016-07-08 05:09:51

구문 오류가 있지만 그렇지 않으면 작동합니다. 고맙습니다. – estus

해결해 주셔서 감사합니다 :) 및 피드백. –

각도 2 기본보기 캡슐화

답변

관련 문제