Wie mit @hostbinding

Question

in Angular 2 Klasse zu einem Host-Elemente geben ich eine Klasse mit dem Host-Elemente meiner Komponente geben will, so ich bis jetzt die host ähnlichen Immobilien Ich bekomme eine Warnung von TypeScript, dass dies eine schlechte Übung ist.

Wie kann ich dem Host-Element eine Klasse korrekter hinzufügen und diese Warnung loswerden?

Thx!

Update: Basierend auf der Antwort unten: Ich bekomme die Klasse, aber der Stil hat keinen Einfluss auf das Eltern-Host-Element, nachdem die Klasse hinzugefügt wurde. Mein Stil ist ganz einfach:

.left-bar { 
    position: fixed; 
    width: 120px; 
    left: 0; 
    top: 0; 
    bottom: 0; 
    background: #323232; } 

Answer 1

Der Führer Angular2 Stil sagt @HostBinding bevorzugen, aber dies nicht host: {...} eine schlechte Sache macht.

können Sie

@Component({ 
    selector: 'left-bar', 
    templateUrl: 'app/left-bar/left-bar.component.html', 
    styleUrls: ['app/left-bar/left-bar.component.css'] 
}) 
export class LeftBarComponent implements OnInit { 
    @HostBinding('class.left-bar') leftBarClass = true; 
    // or @HostBinding('class') leftBarClass = 'left-bar'; 

    ngOnInit() { 
    } 

}