javascript - 将ngModel从子组件插入父对象

我试图从子组件内部使[(ngModel)]工作。我最后想要的是将“大复杂形式”拆分为“小可读形式”。我希望这会使我的代码更容易理解。

这是我无法使用的代码：https://plnkr.co/edit/UrTopLJ8RsZovltDkPiR?p=preview

我从这篇非常有用的文章中分叉了我的代码：https://blog.thoughtram.io/angular/2016/10/13/two-way-data-binding-in-angular-2.html#creating-custom-two-way-data-bindings

我希望有一种方法可以很好地将大表格拆分为角度4。

最佳答案

您所缺少的是吸气剂和吸气剂。使用它们或使用ngModelChange发出修改后的值：

@Input() counter;
@Output() counterChange = new EventEmitter();

然后在模板中：

(ngModelChange)="counterChange.emit(counter)"

PLUNKER

如前所述，您可以将其与表单一起使用。我建议您使用模型驱动的表单，因为那样就不需要了。您可以在父级中构建表单，然后将嵌套的表单组传递给子级。父母会知道您在孩子中所做的更改，而不必使用@Output()

这是一个构建Nested model driven forms的好例子，并带有将嵌套组传递给子组件的例子。