Html 如何在angular 4中防止UI崩溃

我有一个角度4应用程序。我的组件上的HTML页面是

{{myJson['Key'].toLowerCase（）}

。但是，问题是有时“键”在一些JSON文件中不存在，UI会崩溃

TypeError:无法读取未定义的属性“toLowerCase”

我有一个错误处理程序

类myErrorHandler扩展了ErrorHandler

，它记录所有错误。但是，有时由于json数据无效，密钥可能不存在或数据可能不存在。除了使用

*ngIf

检查每个标记外，还有什么方法可以防止UI崩溃？当崩溃发生时，UI元素没有正确对齐（想象一个元素被放置在自身的副本之外）。如果我想阻止这种情况发生，有什么办法

提前谢谢。非常感谢您的帮助。

使用“

？”

（也称为“安全导航”操作员）：

{{myJson？.Key？.toLowercase（）}

使用“

？”

（也称为“安全导航”操作员）：

{{myJson？.Key？.toLowercase（）}

只需清理组件类中的json数据即可。不要只是把它推到视野中。但是您可以在尝试访问它之前使用hasOwnProperty（'Key'）。在您的p标记中，have*ngIf=“myJson['Key']”确保要呈现的对象存在并已定义。我现在已经在所有标记上添加了ngIf。只需清理组件类中的json数据。不要只是把它推到视野中。但是您可以在尝试访问它之前使用hasOwnProperty（'Key'）。在您的p标记中，have*ngIf=“myJson['Key']”确保要呈现的对象存在并且已定义。我现在已经在所有标记上添加了ngIf。typescript中的Official doc@tatsu使用逻辑OR运算符执行空合并。详细说明？如果你真的有一个解决方案，你可以在这里得到100分：在typescript中，Official doc@tatsu使用逻辑OR运算符来执行空合并。详细说明？如果你真的有解决方案，你可以在这里获得100分：

<p>{{ myJson?.Key?.toLowercase() }}</p>