我有这样的事情：
import { Component,OnInit,Input } from '@angular/core';
@Component({
selector: 'column',template: '<ng-content></ng-content>'
})
export class ColumnComponent {
@Input() columnWidth: string = '0';
constructor() {}
}
我想将属性columnWidth应用于[ngStyle]
<ng-content></ng-content>
父元素,做这样的事情：
<div [ngStyle]="{'width': columnWidth+'px'}" > ....
我知道如何将样式应用于主机元素：
:host { /*styles*/ }
但我不知道将参数传递给它.
没有办法做到这一点.
你能做的是
@HostBinding('style.width')
width:string = '10px';
要么
@HostBinding('style.width.px')
width:number = '10';
主要限制是宽度部分是固定的,不能从变量中使用.
另一种充分灵活的方法是
constructor(private elRef:ElementRef,private renderer:Renderer) {}
setStyles() {
this.renderer.setElementStyle(this.elRef.nativeElement,'width','10px');
}
