Angular 6 元素 bool 输入参数

Question

我正在 build 一个 Angular 元素并将一些输入参数传递给它。我可以很好地传递一些字符串输入参数(ikrId 和环境工作完美)，但很难通过 将 bool 值传递给 showTitle 输入属性。 Angular 元素 (将 showTitle 属性从父 Angular 组件传递给组件工作得很好)。

这是组件片段:

export class MyComponent implements OnInit, OnDestroy {

  @Input() ikrId: string;
  @Input('environment') environment: IkrEnvironment = 'PROD';
  @Input('showTitle') showTitle = true;

这是我在 中使用它的方式普通的旧 html :

<my-element environment="DEV" ikr-id="889fb69f-71a5-4881-8528-0b43a07599f0" show-title="false"></my-element>

但是节目标题没有传递到我的组件中，它总是正确的。

我在这里缺少什么？

谢谢!

Answer 1

您可以定义 showTitle属性作为 getter/setter，并将字符串值转换为 setter 中的 bool 值:

private _showTitle = true;

@Input('showTitle') 
get showTitle(): boolean {
  return this._showTitle;
}
set showTitle(value: boolean) {
  this._showTitle = "" + value !== "false";
}