页面渲染正常,但因渲染顺序或生命周期而报错 Expression has changed after it was checked. Previous value: ...(问题解决)

{{currentProjectGroup.name}}--管理员列表页面渲染正常,但仍然报错can not read property ‘name’ of undefined
在这里插入图片描述
这是因为当渲染到这的时候,最开始currentProjectGroup为undefined,自然也就没有属性name,就会先报错,后期currentProject为重新赋值时,渲染成功。为解决这个报错,可加一个判断,如下图

 <span *ngIf="currentProjectGroup">
    {{currentProjectGroup.name}}--管理员列表
 </span>

加上这个判断之后,若currentProjectGroup为undefined则不会渲染,有则显示,大部分时候的报错便可以解决了,但是最近又遇到一个新的由于生命周期而报错:Expression has changed after it was checked. Previous value: ’ ngIf: undefined’. Current value: ‘ngIf: [object object]’.
在这里插入图片描述
查阅官方文档,发现加入导航运算符?解决这个问题非常好用,解决方式如下图

安全导航运算符?

{{currentProjectGroup?.name}}--管理员列表

原理:Angular 安全导航运算符 ? 可以对在属性路径中出现 null 和 undefined 值进行保护。在这里,如果 currentProjectGroup为 null,它可以防止视图渲染失败。
详情可见:angular官方文档安全导航运算符

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值