css - 有 2 个 HostBindings 导致基于输入的类(Angular 4)

Question

我的组件中有以下代码:

@Component({
selector: "home",
templateUrl: "./home.html"
})
export class Home {
    constructor() {}
    @HostBinding("class") @Input() public type: string = "alert"
    @HostBinding("class") @Input() public position: string = "top"
}

和main.html:

<home></home>

home.html 是空的

这不起作用，因为只有 alert 被设置为一个类。我怎样才能同时拥有 alert 和 top ？

Answer 1

我找到了解决方案，我必须执行以下操作:

@Input() public type: string = "alert"
@Input() public position: string = "top"
@HostBinding("class") classes = this.type + " " + this.position