[英]Angular 5 Update Parent Component value from child Component
Child Component TS 子组件TS
import { Component, OnInit, Input, Output } from '@angular/core';
import { EventEmitter } from 'events';
export class ChildComponent implements OnInit {
@Output() OpenScheduleCall = new EventEmitter<boolean>();
onLog() {
this.OpenScheduleCall.emit(false);
}
}
parent Component HTML : 父组件HTML:
<div [(hidden)]="OpenScheduleCall">
// content
</div>
<app-schedule-call *ngIf="!!OpenScheduleCall" [prospectid]='prospectid' [(OpenScheduleCall)]="OpenScheduleCall"></app-schedule-call>
I am setting the values in child component but changes are not reflecting in parent component 我在子组件中设置值,但更改未反映在父组件中
You have not marked OpenScheduleCall
as an input to the child component, so first of all you need to do that. 您尚未将
OpenScheduleCall
标记为子组件的输入,因此首先您需要这样做。 And to achieve two-way-binding with banana in the box, your @Output
needs to be the @Input
variable name, with the suffix Change
. 要在框中实现与banana的双向绑定,您的
@Output
必须是@Input
变量名,后缀为Change
。 So first mark the variable OpenScheduleCall
as @Input
to child and then change the name for @Output
variable: 因此,首先将变量
OpenScheduleCall
标记为@Input
为child,然后更改@Output
变量的名称:
export class ChildComponent implements OnInit {
@Input() OpenScheduleCall;
@Output() OpenScheduleCallChange = new EventEmitter<boolean>();
onLog() {
this.OpenScheduleCallChange.emit(false);
}
}
Now you have two-way-binding: 现在你有双向绑定:
[(OpenScheduleCall)]="OpenScheduleCall"
Just Output
cannot be in two-way data binding. Just
Output
不能进行双向数据绑定。 Add also ()
at the end of the bounded function. 在有界函数的末尾添加
()
。
(OpenScheduleCall)="YourFunctionInParent($event)"
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.