之前,我的Angular 是13,我的组件工作正常!自那以后,我已经升级到了Angel的其他版本,目前是16版.我想修复一个warning,因为我有一个语法问题.

src/app/.../annexes.component.html:6:65 - warning NG8107: The left side of this optional chain 
operation does not include 'null' or 'undefined' in its type, therefore the '?.' 
operator can be replaced with the '.' operator.     

 <h2 *ngIf="annexeDetails">{{ annexeDetails?.TITRE }} - {{ id }}</h2>  

src/app/.../annexes.component.ts:15:16
templateUrl: './annexes.component.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component AnnexesComponent.

Warning: src/app/.../corporate-actions-details-confirm-modal/corporate-actions-details-confirm-modal.component.html:32:60 - 

warning NG8107: The left side of this optional chain operation does not include 'null' 
or 'undefined' in its type, therefore the '?.' operator can be replaced with the '.' operator.      

32 - {{ ostDetail?.LIMITEDATE | date: "d MMMM y" }}.
                                                              ~~~~~~~~~~

src/app/.../corporate-actions-details-confirm-modal/corporate-actions-details-confirm-modal.component.ts:14:16
14   templateUrl: './corporate-actions-details-confirm-modal.component.html',

我换掉了

<h2 *ngIf="annexeDetails">{{ annexeDetails?.TITRE }} - {{ id }}</h2>  

使用

<h2 *ngIf="annexeDetails">{{ annexeDetails.TITRE }} - {{ id }}</h2>

和 the second

{{ ostDetail?.LIMITEDATE | date: "d MMMM y" }}

使用

{{ ostDetail.LIMITEDATE | date: "d MMMM y" }}

但它不适用于这些新的修改,因为ostDetail可以是null也可以是undefined.

我不知道如何解决这个问题.我将不得不返回到版本13吗?

推荐答案

正如您在注释中确认的那样,您的模板代码中有@Input() ostDetail!: Ost;个.

感叹号是non-null assertion operator.您是在告诉编译器您提供的是非空值和未定义的值.但你是吗?

我假设您的父组件中有大约[ostDetail]="ostDetail$ | async"个.在这种情况下,ostDetail可以是空的,直到可观测ostDetail$产生一个值.您可以使用*ngIf或使用Ost | null类型来修复它.

我鼓励你在Angular 上使用strict mode.一开始可能会很烦人,但它真的会让你受益.

Typescript相关问答推荐

Angular -使用Phone Directive将值粘贴到控件以格式化值时验证器不工作

有没有可能使用redux工具包的中间件同时监听状态的变化和操作

如何用不同的键值初始化角react 形式

类型脚本接口索引签名

在泛型类型中对子代执行递归时出错

对于始终仅在不是对象属性时才抛出的函数,返回Never

声明遵循映射类型的接口

我不明白使用打字脚本在模板中展开参考

打字错误TS2305:模块常量没有导出的成员

TaskListProps[]类型不可分配给TaskListProps类型

编剧- Select 下拉框

如何以类型安全的方式指定键的常量列表,并从该列表派生所挑选的接口?

如何在TypeScript中描述和实现包含特定属性的函数?

如何从联合类型推断函数参数?

在类型{}上找不到带有string类型参数的索引签名 - TypeScript

为什么 TypeScript 类型条件会影响其分支的结果?

基于泛型类型的条件类型,具有条目属性判断

TS 条件类型无法识别条件参数

在Typescript 中,是否有一种方法来定义一个类型,其中该类型是字符串子集的所有可能组合?

使用react+ts通过props传递数据