Angular 角度类型脚本如何在父组件中查看动态生成的子组件的特定值
我有一个名为“quick”的父组件。在这个组件中,我根据来自服务(我在初始值设定项中订阅)的索引值生成几个子组件实例 这是家长的HTML代码(测验)Angular 角度类型脚本如何在父组件中查看动态生成的子组件的特定值,angular,typescript,Angular,Typescript,我有一个名为“quick”的父组件。在这个组件中,我根据来自服务(我在初始值设定项中订阅)的索引值生成几个子组件实例 这是家长的HTML代码(测验) {{item.name} //子组件 添加 在名为“Question”的子组件中,有一个formgroup。这个表单是动态的——在我的例子中,这意味着你可以向这个表单添加一个问题或删除一个问题。这导致了一系列问题 这是添加问题的子(问题)组件的TS代码 addQuestion() { const control = <Form
{{item.name}
//子组件
添加
在名为“Question”的子组件中,有一个formgroup。这个表单是动态的——在我的例子中,这意味着你可以向这个表单添加一个问题或删除一个问题。这导致了一系列问题
这是添加问题的子(问题)组件的TS代码
addQuestion() {
const control = <FormArray>this.addQuestionsForm.controls['questions'];
control.push(this.initQuestions());
console.log(control);
}
initQuestions(){
return this.fb.group({
name: ['', [Validators.required, Validators.minLength(5)]],
qtype: ['', [Validators.required]],
value: ['', [Validators.required]]
});
}
addQuestion(){
const control=this.addQuestionsForm.controls['questions'];
control.push(this.initQuestions());
控制台日志(控制);
}
初始问题(){
返回此.fb.group({
名称:['',[Validators.required,Validators.minLength(5)],
qtype:[''[Validators.required]],
值:[''[Validators.required]]
});
}
我现在需要访问父组件中每个子组件实例的问题数组(命名控件),因为生成的每个子组件都可以有大小和内容不同的问题列表。最后,我想将这个数组附加到一个二维数组中,以便索引表示子组件“id”。
我应该如何最好地处理这个问题
如果需要,我可以提供更多代码或plnkr。我认为您有两种选择:
我个人更喜欢在大多数应用程序中使用REDUX,尽管我认为它不值得为一个小项目而烦恼。我实际上已经观看了该视频,并发现它非常有用(正如您所看到的,我已经为另一个值实现了一个事件发射器)。虽然我的问题实际上更多的是针对如何获取包含该值的孩子的身份,如果这有意义的话。我如何知道哪个子实例正在向我传递哪个值?我确实觉得REDUX方法非常有趣,可能会(最终)实现它。然而,对于第一个版本,我很可能会保持简单,因为我已经走上了事件发射器的路线。非常感谢。我已经开始聊天了,因为它有点长,我看到您在使用*ngFor时已经将索引声明为键。现在我在子组件中要做的是创建一个索引输入属性@INPUT()index;然后,当您使用[index]=“key”对子组件进行排序时,这有意义吗?
addQuestion() {
const control = <FormArray>this.addQuestionsForm.controls['questions'];
control.push(this.initQuestions());
console.log(control);
}
initQuestions(){
return this.fb.group({
name: ['', [Validators.required, Validators.minLength(5)]],
qtype: ['', [Validators.required]],
value: ['', [Validators.required]]
});
}