Javascript 从父组件到子组件的角度绑定对象

我对Anglular 8和将输入参数从父组件绑定到子组件有问题。 我有以下设置：

-app.component.ts

从'@angular/core'导入{Component}；
@组成部分({
选择器：'应用程序根'，
templateUrl:“./app.component.html”，
样式URL:['./app.component.css']
})
导出类AppComponent{
标题='父子绑定'；
showTitle:boolean=true；
childData=[]；
onBoolean（）{
this.showTitle=！this.showTitle；
}
onComplexAdd（）{
这个.childData.push（“数据4”）；
这个.childData.push（“数据5”）；
}
onComplexEdit（）{
this.childData[0]=“数据1已编辑”；
this.childData[1]=“数据2已编辑”；
}
onComplexNew（）{
此.childData=[
“数据1”，
“数据2”，
“数据3”
]
}
}

-app.component.html

布尔绑定
复杂对象新
复杂对象编辑
复杂对象添加

和控制台：


当我点击第一个按钮时，正如预期的那样，标题
Hello from child
显示并消失。
当我点击第二个按钮时，正如预期的那样，我看到：


和控制台：


当我单击第三个和第四个按钮时，没有任何事情发生，UI或控制台中没有（onChanges

方法似乎没有启动）

我做错了什么，或者我想达到的目标是不可能的

致以最良好的祝愿， 朱利安

编辑：在@MBB和@Apoorva Chikara的评论和回答之后，我编辑了代码

布尔绑定
复杂对象新
复杂对象编辑
复杂对象添加

但是在控制台中，没有
ngOnChanges
回调触发，但是绑定对象已经更改，正如我们在打印屏幕上看到的那样（
{{item}
）触发并打印出新值

当我单击复杂对象添加按钮时，也会发生同样的情况。在UI中，我看到：


但是在控制台中，
ngOnChanges
回调没有启动，但UI包含新添加的数据

我很困惑，有人能给我一些建议吗？
您有一个非常简单的解决方案，您不是在调用函数，而是在分配它的定义：

<button (click)="onComplexEdit()">Complex Object Edit</button> // call it as a function
<button (click)="onComplexAdd()">Complex Object Add</button>// call it as a function

复杂对象编辑//将其作为函数调用
复杂对象添加//将其作为函数调用

对于
NgonChanges
，您面临的问题是由于通过引用传递的数组引起的，它很好地解释了为什么会发生这种情况。
您有一个非常简单的解决方案，您没有调用函数，而是分配了它的定义：

<button (click)="onComplexEdit()">Complex Object Edit</button> // call it as a function
<button (click)="onComplexAdd()">Complex Object Add</button>// call it as a function

复杂对象编辑//将其作为函数调用
复杂对象添加//将其作为函数调用

您面临的
NgonChanges
问题是由于通过引用传递的数组引起的，它很好地解释了为什么会发生这种情况。
为什么您不能更改行（onComplexEdit）->onComplexEdit（）（onComplexAdd）->onComplexAdd（）Hi@MBB感谢您的评论！我已经编辑了原始问题，因为您建议的更改是有效和正确的，但不能解决我的问题。为什么您不能更改行（onComplexEdit）->onComplexEdit（）（onComplexAdd）->onComplexAdd（）Hi@MBB谢谢您的评论！我已经编辑了原始问题，因为您建议的更改是有效和适当的，但并不能解决我的问题。嗨@Apoorva Chikara谢谢您的回答！我已经编辑了原始问题，因为您建议的更改是有效和正确的，但并不能解决我的问题。更改中显示了什么？你现在能在问题中添加细节吗？这就是问题所在。在回调
ngOnChanges
中，我有一个
console.log（changes）
，但在最后两个按钮中，控制台窗口中没有任何内容。您似乎得到了类型值：
SimpleChanges
它是什么？试着去掉它，看看你得到了什么。当然，你可以接受答案。同时我会更新答案。嗨@Apoorva Chikara谢谢你的回答！我已经编辑了原始问题，因为您建议的更改是有效和正确的，但并不能解决我的问题。更改中显示了什么？你现在能在问题中添加细节吗？这就是问题所在。在回调
ngOnChanges
中，我有一个
console.log（changes）
，但在最后两个按钮中，控制台窗口中没有任何内容。您似乎得到了类型值：
SimpleChanges
它是什么？试着去掉它，看看你得到了什么。当然，你可以接受答案。同时我会更新答案。