şu ana kadar böyle <code>host</code> özelliği kullanılan bu yüzden benim bileşenin konak elemanı için bir sınıf vermek istiyorum

Question

@hostbinding ile açısal 2'de bir konak elemana sınıfını vermek için: gerçi Şimdi

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

    ngOnInit() { 
    } 

} 

TypeScript'ten bunun kötü bir uygulama olduğuna dair bir uyarı alıyorum.

[tslint] In the "@Component" class decorator of the class "LeftBarComponent" you are using the "host" property, this is considered bad practice. Use "@HostBindings", "@HostListeners" property decorator instead. 

Nasıl daha doğru bir şekilde ev sahibi öğesine bir sınıf ekleyebilir ve bu uyarı kurtulmak?

Thx!

Güncelleme: Aşağıdaki cevaba göre: Sınıfı aldım ancak stil, sınıf eklendikten sonra ana ana makine öğesini etkilemiyor. Tarzım oldukça basittir:

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

Answer 1

Angular2 stil kılavuzu @HostBinding tercih söylüyor ama bu host: {...} kötü bir şey yapmaz.

Derslere ekler ancak ben ne zaman bu benim tarzım konak öğesi etkilemiyor

@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() { 
    } 

}