Question

我正在定义我认为是一个非常简单的函数，如果该值存在，它将绘制从服务器返回的值。无法编译，并显示“值可能为空”的打字稿错误。

由于它位于* ngif内，所以我认为它不为null应该足够了。但是为了安全起见，我向对象添加了非空指令（！）。但是我仍然得到错误。我什至将其添加到对象的属性中，以防万一。仍然出现错误。

<div *ngIf="info">
  <p>Info Id: {{info!.id!}}</p>
  <p>Info databaseText: {{info!.databaseText!}}</p>
  <p>Info localText: {{info!.localText!}}</p>
  <p>Info computedText: {{info!.computedText!}}</p>
</div>

不确定下一步如何尝试。任何想法，将不胜感激。我不想禁用打字稿null检查。

Answer 1

应该是问号。因此

<div *ngIf="info">
  <p>Info Id: {{info?.id}}</p>
  etc.

Answer 2

为什么在属性前面有 ! ，请尝试不使用它，它应该可以工作，

<div *ngIf="info">
  <p>Info Id: {{info.id}}</p>
  <p>Info databaseText: {{info.databaseText!}}</p>
  <p>Info localText: {{info.localText!}}</p>
  <p>Info computedText: {{info.computedText!}}</p>
</div>

Answer 3

使用可选参数，例如

  <div *ngIf="info">
    <p>Info Id: {{info?.id!}}</p>
    <p>Info localText: {{info.?localText!}}</p>
  </div>

如果这就是您要寻找的

Answer 4

您的代码：

  <p>Info Id: {{info!.id!}}</p>
  <p>Info databaseText: {{info!.databaseText!}}</p>
  <p>Info localText: {{info!.localText!}}</p>
  <p>Info computedText: {{info!.computedText!}}</p>
</div>

那是什么意思？ <p>Info Id: {{info!.id!}}</p>

!被称为非空断言运算符。简而言之，我们说的是告诉打字稿，无论发生什么情况，!之前的值都不能为null或未定义。在上面的示例中，可能定义了info，但是info.computedText或info的任何其他属性未定义或为空。

仅在总能100％确保所检查的值不能为null或未定义的情况下，才使用Non-Null断言运算符。

如果您使用Google搜索非空断言运算符，则会在该主题上找到更多信息。：）

Answer 5

如@ bryan60所建议，该问题原来是一个错误的声明。我将info变量更改为info: any;，现在它可以正常工作了！要么？需要。谢谢！

* ngif模板内部的打字稿为空错误

5 个答案: