2016-07-07 8 views
3

Es gibt bereits an answered question, die den Unterschied zwischen ViewEncapsulation.Emulated, ViewEncapsulation.Native ad ViewEncapsulation.None erklärt.Angular 2 native Ansicht Kapselung

Angenommen, es gibt eine Electron-Anwendung, die garantiert mit der Chromium-Version gebündelt wird, die nativ Schatten-DOM und ViewEncapsulation.Native unterstützt. Wie kann dieser Fall von der nativen Kapselung profitieren, um den Emulationsaufwand zu vermeiden?

Ein anderer möglicher Fall ist das Debuggen von Ansichten in Angular 2-Anwendung, die aufgrund von ViewEncapsulation.Emulated mit Hilfsattributen und Namespaced-CSS-Klassen stark überfüllt sind.

Kann die Standardkapselung für alle Komponenten, die nicht encapsulation angeben, global in ViewEncapsulation.Native geändert werden?

Was sind die anderen praktischen Geräte von ViewEncapsulation.Native?

Antwort

3

Nach https://github.com/angular/angular/pull/7883 sollte diese Arbeit

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

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

Ich habe es nicht versucht, mich allerdings noch.

Ich denke, ViewEncapsulation.Native wird vor allem dann vorteilhaft sein, wenn man nur auf Chrome abzielt. Es scheint, dass es noch einige Zeit dauern wird, bis andere Browser ihre Schatten-DOM-Unterstützung freigeben.

Der Hauptvorteil ist, dass Angular2 keine Attribute zu jedem Komponentenelement hinzufügen muss und dass nicht mehr alle Komponentenstile zu hinzugefügt werden müssen.

Die Leistung wird in den meisten Fällen mit Emulated kein Problem sein, wenn der Offline Template Compiler verwendet wird.

+1

Es gab einen syntaktischen Fehler, aber ansonsten funktioniert es. Vielen Dank. – estus

+0

Danke für die Befestigung :) und für die Rückmeldung. –