Typescript 如何将对象绑定到一个组件到另一个组件？

我试着学习Angular8，但现在我遇到了一个问题，那就是如何将一个对象或值从一个组件传递到另一个组件

我尝试了@Input，但结果未定义

我有这个组件，返回两个输入的结果；标题和描述。 在组件应用程序添加项之后

从'@angular/core'导入{Component，OnInit}；
@组成部分({
选择器：“应用程序添加项”，
templateUrl:“./add item.component.html”，
样式URL:['./add item.component.scss']，
})
导出类AddItemComponent实现Onit{
项目=[]；
//itemList->chenge下一步选择一的列表
itemList='示例'；
itemID:number=this.items.length+1；
itemTitle:字符串；
itemDescription:字符串；
恩戈尼尼特（）{
this.itemTitle=''；
this.itemsdescription=''；
}
附加项（）{
这个。项目。推({
list:this.itemList，
id:this.itemID，
标题：this.itemTitle，
description:this.itemsdescription，
已完成：错误，
});
这个.itemID++；
这个；
}
}

应用程序添加项的html模板

添加todo项是第二个组件。该组件将生成项目视图

在组件应用程序todo项之后

从'@angular/core'导入{Component，Input}；
与文档的接口{
列表：字符串；
id：编号；
标题：字符串；
description？：字符串；
完成：布尔；
}
@组成部分({
选择器：“应用程序待办事项”，
templateUrl:'./view item.component.html'，
样式URL:['./查看项.component.scss']，
})
导出类ViewItemComponent{
@Input（）itemTitle:字符串；
项目：TodoItem={
列表：“示例”，
id:1，
标题：this.itemTitle，
描述：“视图模型的示例列表项”，
已完成：错误，
};
}

谢谢你的回答

export class ViewItemComponent {
  @Input() itemTitle: string;
  item: TodoItem = {
    list: 'example',
    id: 1,
    title: this.itemTitle,
    description: 'an example list item for the view model',
    completed: false,
  };
}

在上面的代码中，“item”的值在您将任何文本输入文本框之前设置为object literal。这意味着在进行任何输入绑定之前，“item.title”将被设置为未定义

如果将itemTitle设置为setter，则可以在用户每次向文本字段输入输入时设置“item.title”的值

@Input()
set itemTitle(value) {
  this.item.title = value;
}
item: TodoItem = {
  list: 'example',
  id: 1,
  title: 'Default Title',
  description: 'an example list item for the view model',
  completed: false,
};

或者，可以在additem组件中绑定整个todo项对象

// add-item.component.html
<div class="item-content" *ngFor="let item of items">
  <app-todo-item [item]="item"></app-todo-item>
</div>

// view-item.component.ts
export class ViewItemComponent {
  @Input()
  item: TodoItem;
}

//add-item.component.html
我尝试重新创建您上面的内容，但无法准确了解您遇到的问题。你能再详细一点吗？问题是，当我绑定itemTitle时，在浏览器视图中不显示todo项目中的标题，如果我确实未定义console.log（this.itemTitle），请给我提供。
// view-item.component.html
<p>ItemID-{{ item.id }}</p>
<p>{{ item.title }}</p>
<p>{{ item.description }}</p>