2 @HostBinding 1个成员在Angular

Question

当使用我的组件时，我使用以下命令默认引导类。效果很好（角度6）：

@Input()
@HostBinding('class.form-control')
hasFormControl: boolean = true;

但是我想将其他HostBindings配置为在相同变量为true时应用，如下所示：

@Input()
@HostBinding('class.form-control')
hasFormControl: boolean = true;
@HostBinding('class.px-0') this.hasFormControl; // does not compile

如何正确执行此操作？

Answer 1

您可以多次将@HostBinding(...)应用于 same属性，以实现所需的结果：

@Input()
@HostBinding('class.form-control')
@HostBinding('class.px-0')
hasFormControl: boolean = true;

Answer 2

可能是：

_hasFormControl: boolean = true;

@HostBinding('class.form-control')
get classFormControl() { return this._hasFormControl; }
@HostBinding('class.px-0')
get classPx0() { return this._hasFormControl; }