映射没有值的组件属性

Mapping component attributes without a value

我正在为我的 Angular 组件提供 属性。 属性 是指您在 HTML 中输入的切换式布尔属性，但未指定属性值：

相对于输入（这不是我想要的）：

如果存在 compact，则组件应将其值强制转换为布尔值：

  1. <my-component compact="compact"> // <= 真
  2. <my-component compact="true> // <= 真
  3. <my-component compact="false"> // <= 真？

如果 compact 没有值则它映射到 true:

  1. <my-component compact> // <= 真

如果 compact 遗漏：

  1. <my-component> // <= false

然而，当我让它没有属性值时，组件会看到 null，所以我无法区分情况 #4 和 #5，即使我在构造函数中提供了默认值。

  constructor(
    @Attribute('compact') public compact,
  ) {
    console.log(this.compact) // `null` for <my-component compact>
  }

我该怎么办？ Attribute装饰器单独能行吗

在#1~4 的情况下，compact 的值的类型将始终为字符串。

在案例 #4 中，compact 的值是 空字符串 （string 的类型），而案例 #5 将是 null（object 的类型），因此您可以通过 typeof(compact).

区分案例 #4 和 #5