formControl中的Angular2输入/输出而不是ngModel答案

【问题标题】：Angular2 Input/Output in formControl instead ngModelformControl中的Angular2输入/输出而不是ngModel
【发布时间】：2017-07-03 23:30:08
【问题描述】：

我有一个日历指令，我在其中传递日期并希望它也更新父组件的日期。它在 ngModel 上运行良好，但在尝试使用 formControl 时，它不会更新父组件的数据。下面是代码sn-p：

// Model value is updating:
<input [(ngModel)]="data" />
<calender [(currentDate)]="currentDate"  ></calender>

//  FormControl value is not updating:
<form [formGroup]="myForm">
<input formControlName="date" />
<calender [(currentDate)]="myForm.controls.date.value"  ></calender>`
</form>

日历组件的代码sn-p：

@Input() currentDate:string;
@Output() currentDateChange: EventEmitter<string> = new EventEmitter<string>();
updateOutput(){ this.currentDate="someDate" this.currentDateChange.emit(this.currentDate); }

【问题讨论】：

很难说没有看到更多日历代码，但我想你可能没有实现 ControlValueAccessor 接口。这篇文章非常适合创建自定义控件：blog.thoughtram.io/angular/2016/07/27/…
尝试在
元素上使用 [(formGroup)] 绑定
在父模板中，尝试使用myForm.get('date').value 访问字段值。另外，当你切换到新的语法时，你有没有想过在你的模块中导入ReactiveFormsModule，你有没有在你的组件类中创建表单模型？

标签： angularjs angular angularjs-scope angular2-forms

【解决方案1】：

您不需要输出。如果您使用 [(ngModel)] 更新输入，则输入将保持父日期最新

【讨论】：

[(ngModel)] 代码运行良好，但使用 formControl 时，它不会更新 formControl 值