我在开始时有一个空数组。之后我将对象推送到该数组。
此数组在父组件中,并由[input]传递给子组件 问题是当我添加一个对象时,孩子没有检测到任何变化。
我使用ngOnChanges,当我扩展数组时,没有更改的日志:(
<!DOCTYPE html>
<html>
<head>
<title>Bienvenue!</title>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<link rel="shorcut icon" href="favicon (2).ico"/>
</head>
<body>
<!-- Logo section -->
<img id="logo" src="logo.png"/>
<!-- Icons section -->
<div id="fbicon" class="icons"><a href="#"><img src="icons/facebook.png"/></a> </div>
<div id="liin" class="icons"><a href="#"><img src="icons/linkedin.png"/></a></div>
</body>
</html>
所以我不知道当孩子知道父数据发生变化时我怎么能调用任何动作
答案 0 :(得分:1)
使用@output和EventEmitter概念检测子组件上发生的更改并将其传递给父组件
@Output() userName : EventEmitter<string>= new EventEmitter<string>();
并在父组件模板中调用上面使用的变量
<child-component (userName)='OnDataChange($event)'></child-component>
答案 1 :(得分:0)
您无法记录每次发送的“更改”,但您仍然可以在 ngOnChanges 中调用操作
如果您的@Input获得更新数据 ngOnChanges 将会触发,您可以在那里调用一个函数。例如。
@Input() listings: List; //assume this is array of list
ngOnChanges(changes: SimpleChanges) {
if(this.listings)
this.onClick(this.listings[0]); //on changes, call Onclick on 1st list
}
onClick(list){
//do something with list
}