我有两个组件,我想在点击时从父组件打印子组件中的文本。
父组件:
import {Component, OnInit, ViewChild} from '@angular/core';
@Component({
selector: 'parent',
templateUrl: 'parent.html'
})
export class ParentComponent implements OnInit {
@ViewChild(ChildComponent) child;
constructor() {
}
ngOnInit() {
}
click(){
console.log(this.child.text);
}
}
子组件:
import {Component, OnInit} from '@angular/core';
@Component({
selector: 'child',
templateUrl: 'child.html'
})
export class ChildComponent implements OnInit {
constructor() {
}
ngOnInit() {
const text = 'TEXT HERE';
}
//Some code...
}
我是棱角分明的新人。只是想知道如何使它工作,我希望一些常量在一个点上并由其他人共享。没有必要,常量只能在子组件中。只需要一个关于如何使其与良好的编码策略一起工作的好建议
这对我不起作用。
由于
答案 0 :(得分:1)
我的解决方案是在这两个组件之间创建一个sharedService
/// SharedService
export class SharedService {
sharedConst: string = 'blabla';
}
//// ParentComponent
@Component({
...,
providers: [SharedService]
})
export class ParentComponent {
constructor(private sharedService: SharedService){}
}
//// ChildComponent
@Component({
...,
template: `{{sharedService.sharedConst}}`
})
export class ChildComponent {
constructor(public sharedService: SharedService){}
}
答案 1 :(得分:0)
text
是ngOnInit
方法的局部变量。它只存在于该方法中,并且在此方法存在时消失。您需要使它成为ChildComponent类的实例字段:
export class ChildComponent implements OnInit {
text: string;
ngOnInit() {
this.text = 'TEXT HERE';
}
}