在 ngIf 中需要从对象值返回一个布尔值答案

【问题标题】：In ngIf need to return a boolean from object value在 ngIf 中需要从对象值返回一个布尔值
【发布时间】：2022-01-09 20:01:41
【问题描述】：

在 ngIf 中需要从对象值返回一个布尔值。

var a = {"c" : "b","f": "g"}

a["c"] => 'b'

(a && a["c"]) => 'b' // 为什么这里没有返回 true

a && a["c"] => 'b' // 如何从这里的值返回布尔值

!!( a && a["c"]) => true // 是返回 true 的正确方式还是其他更好的方式？

<button title="Submit" *ngIf="!!(a && a["c"])">Submit</button>

【问题讨论】：

*ngIf 中的任何条件都会自动转换为布尔值，您不需要手动执行，a["c"] 和a && a["c"] 都是正确的。
(a && a["c"]) 如果a 为假，则返回a，如果a 为真，则返回a["c"]。一个对象总是真实的，因此(a && a["c"]) 返回"b"。 !! 是将真值转换为真，将假值转换为假的常用操作。我会使用!!(a && a["c"]) 将(a && a["c"]) 转换为布尔值。您可以使用 !!a?.c 使其更短。
(a && a["c"]) => 'b' ... (a) && (a["c"] => 'b') - 你有括号优先级问题
@JGFMK 我不认为(a && a["c"]) => 'b' 是实际代码。代码是(a && a["c"])，'b' 是结果。您的推荐 a["c"] => 'b' 甚至不是有效的 JavaScript。
a 表示“a”存在。 a["c"]，取内容的值 - b 并说它是否大于或等于 b - 它会是 - 你不能对真值和字符进行逻辑或运算 - 并将其与 a 进行比较字符文字 - 所以我是正确的。

【解决方案1】：

“为什么这里没有返回 true”

(a && a["c"]) 如果a 为假，则返回a，如果a 为真，则返回a["c"]。对象总是真实的，因此(a && a["c"]) 返回"b"。

“如何从此处的值返回布尔值”

!!是一种常见的操作，将真值转换为真，将假值转换为假。

“是返回 true 的正确方法还是其他更好的方法？”

这是正确的，我会使用!!(a && a["c"]) 将(a && a["c"]) 转换为布尔值。

您可以使用!!a?.c (optional chaining) 使其更短：

<button title="Submit" *ngIf="!!a?.c">Submit</button>

甚至

<button title="Submit" *ngIf="a?.c">Submit</button>

如果你的 TypeScript 配置允许的话。

我建议检查truthy 和falsy 值的列表。有时结果可能非常令人惊讶。

【讨论】：