无法在angular 9中将值从父组件传递到子组件
基本情况是,我正在使用EventEmitter将变量的值向上移动到它的父组件上(到目前为止,它还可以正常工作) 但一旦这个值到达grandparent,我想把这个值传递给它的另一个子组件。我在子组件中使用无法在angular 9中将值从父组件传递到子组件,angular,typescript,Angular,Typescript,基本情况是,我正在使用EventEmitter将变量的值向上移动到它的父组件上(到目前为止,它还可以正常工作) 但一旦这个值到达grandparent,我想把这个值传递给它的另一个子组件。我在子组件中使用@input name:string来执行此操作。但我不知道为什么我不能在那个子组件中得到那个名字 父项=> //html code <personal-section (childName)="getName($event)"></personal-section> &
@input name:string
来执行此操作。但我不知道为什么我不能在那个子组件中得到那个名字
父项=>
//html code
<personal-section (childName)="getName($event)"></personal-section>
<profile-section [name]="name"></name>
//inside profile.ts
getName($event) {
console.log(this.name); // <--- upto this console, program works fine
this.name= $event;
}
//html代码
//内轮廓
getName($event){
console.log(this.name);//
@Input()名称:任意;
ngOnChanges(){
如果(此名称){
console.log('users name is',this.name);//将控制器中的getName($event)
替换为getName(event)
只是惯例问题
此外,如果您只想将name
变量从一个子项发送到另一个子项,则可以在不涉及父项的情况下使用自定义变量
父模板
然后可以从“profile section”组件中的name
属性中删除@Input
装饰器
剖面构件
导出类ProfileSectionComponent实现OnInit{
名称:任何;
公共集合名(名称:任意){
this.name=名称;
console.log('User name is',this.name);
}
.
.
}
1.将getName($event)
替换为getName(event)
,控制器中不需要$2.请在getName(event)内部执行event
的console.log
并将结果发布到问题中。@Michael D感谢您的回复。正如您所说,我已进行了更改。但我在该子项中没有得到该值:)我已发布了一个答案。请查看它是否适用于您。
@Input() name: any;
ngOnChanges() {
if (this.name) {
console.log('users name is ', this.name); //<--this never prints.
}
}