键入"列表 |未定义"不能分配给"列表"类型。类型"未定义"不可分配给类型"列表"

Question

你好，在我的项目中寻求帮助问题是，我正在与一个错误作斗争https://github.com/abhijitutkarsh/buyandsell/blob/main/src/app/listing-detail-page/listing-detail-page.component.ts上面的链接有代码库，在编译时它显示一个错误，说

src/app/listing-detail-page/listing-detail-page.component.ts:20:5 - error TS2322: Type 'Listing | undefined' is not assignable to type 'Listing'.
Type 'undefined' is not assignable to type 'Listing'.
20 this.listing = fakeListings.find(listing => listing.id === id);

基本上是关于显示来自fake-data.ts的数据的代码。这里我从路由器url获取id。被困在这里了。问题有点小，无法识别

Answer 1

当find没有找到结果时，可能会返回undefined。您可以将undefined添加到清单类型:

listing: Listing | undefined;
constructor(
private route: ActivatedRoute,
) { }
ngOnInit(): void {
const id = this.route.snapshot.paramMap.get('id');
this.listing = fakeListings.find(listing => listing.id === id);
}

或者检查是否有结果:

listing: Listing;
constructor(
private route: ActivatedRoute,
) { }
ngOnInit(): void {
const id = this.route.snapshot.paramMap.get('id');
const fakeListing = fakeListings.find(listing => listing.id === id);
if (fakeListing !== undefined){
this.listing = fakeListing;
}
}

Answer 2

this。listing = fakeListings。找到(l =比;l.id === id)作为清单;