Angular 如何解决；财产不存在'；t存在于类型对象“中”；角度误差？

在我的应用程序中，有一个父组件，它包含表示不同结果的对象列表。当用户选择水果时，其数据将传递给子组件，该子组件 将所有数据显示为详细信息

        <app-details 
            [fruit]="selectedFruit"
        ></app-details>

在详细信息模板中：

<div class="fruit-details">
    <h1>{{fruit.name}}</h1>
    <h1>{{fruit.color}}</h1>
    <h1>{{fruit.description}}</h1>
</div>

{{fruit.name}
{{水果颜色}
{{fruit.description}}

“水果”属性设置为详细信息组件中的类型对象。

@Input（）水果：对象

出现错误，说明类型“Object”上不存在类似
属性“description”的内容。
。不将“水果”属性设置为“对象”的数据类型可以解决问题。但是如何在不删除数据类型的情况下解决此问题。
如何使用@Input（）fruit:string，将您选择的水果字符串化

JSON.stringify(selectedFruit)

详细内容如下：

let parseFruit = JSON.parse(this.fruit); 
console.log(parseFruit);

为
Fruit
声明一个接口，然后将其用作您的类型：

interface Fruit { 
    name: string;
    color: string;
    description: string;
}

@Input()fruit: Fruit;

对象不是水果的正确类型<代码>水果：{[key:string]：任何}

都会工作得更好，如果您可以创建自己的水果界面，那将是理想的选择。