如何解决这个问题。
在具有两种类型错误控制台中
1)对象可能“未定义”。
=〉error in code --〉this.navigationExtras.state.value = item;
2)属性“value”来自索引签名,因此必须使用[“value”]访问它。
=〉error in code --〉this.navigationExtras.state.value = item;
list.component.ts文件
import { Component, OnInit } from '@angular/core';
import { NavigationExtras,Router} from '@angular/router'
@Component({
selector: 'app-list',
templateUrl: './list.component.html',
styleUrls: ['./list.component.scss']
})
export class ListComponent implements OnInit {
item:any;
navigationExtras: NavigationExtras = {
state: {
value :null
}
};
constructor(private router: Router) { }
ngOnInit(): void {
}
onGotoEdit(item:any):void{
this.navigationExtras.state.value = item; //error
this.router.navigate(['edit'])
}
onGotoSee(item:any):void{
this.router.navigate(['details'])
}
onGotoDelete(item:any):void{
alert('Deleted');
}
}
edit.components.ts
错误在这个文件--〉类型'{ [k:字符串]:任意;}|“undefined”不能分配给类型“null”。类型“undefined”不能分配给类型“null”。
代码错误--〉this.value = navigation?.extras?.state
import { Component, OnInit } from '@angular/core';
import {Router} from '@angular/router'
@Component({
selector: 'app-edit',
templateUrl: './edit.component.html',
styleUrls: ['./edit.component.scss']
})
export class EditComponent implements OnInit {
value = null;
constructor(private router :Router) {
const navigation = this.router.getCurrentNavigation();
this.value = navigation?.extras?.state;
}
ngOnInit(): void {
}
}
2条答案
按热度按时间np8igboo1#
你确定你不知道传递给
onGotoEdit()
的是什么类型的项吗?最好是类型检查。让我们添加一个if检查,以确保我们有这个对象,我们正在尝试分配项。但是索引签名错误是通过执行错误中所述的操作来修复的:
.state['value']
,而不是.state.value
(或.state?.value
)。下面是一个工作示例:https://stackblitz.com/edit/angular-ivy-295kkz?file=src%2Fapp%2Fapp.component.ts
hi3rlvi22#
在表单或路由器状态/extra的情况下,明智的做法是使用
['square-brakets']
,但对于其他情况,我建议使用tsconfig.json更改