Angular 2 - How do I catch the touched value of a child Input element

Question

I am trying to use ng2-datepicker and I'm not getting the touched response from the input element. The datepicker-input is being flagged as touched but its not bouncing up to Angular.

<ng2-datepicker class="form-control ng-untouched ng-pristine ng-invalid" formcontrolname="datefound" _nghost-lur-40="" ng-reflect-name="datefound">
  <div _ngcontent-lur-40="" class="datepicker-container u-is-unselectable">
    <div _ngcontent-lur-40="" class="datepicker-input-container">
      <input _ngcontent-lur-40="" class="datepicker-input ng-untouched ng-pristine ng-valid" type="text">
      <div _ngcontent-lur-40="" class="datepicker-input-icon">
        <i _ngcontent-lur-40="" class="ion-ios-calendar-outline"></i>
      </div>
    </div>
    <!--template bindings={
  "ng-reflect-ng-if": null
}-->
  </div>
  </ng2-datepicker>

Is there a way in Angular 2 to get the datepicker-input and attach the onTouchedCallback action to it? I don't want to modify the ng2-datepicker module so I want to do all of my code from the parent.

Can I do something similar to the following:- form.get('datefound')('.datepicker-input').touched

Are you able to handle the event when a date is selected in the calendar? — Christopher Moore, Jan 30 '17 at 12:27
Yeah. When the date is selected in the calendar it works as expected. Its only if I enter something directly into the input box that it has no effect — Campey, Jan 31 '17 at 01:30

score 0 · Answer 1 · answered Jan 31 '17 at 04:29

This isn't the greatest answer however! To get around this I updated the module itself (something I didn't want to do) to add the following:-

This fired off the required actions which then allowed me to validate correctly.

Its not what I originally wanted however its my current solution.

Angular 2 - How do I catch the touched value of a child Input element

1 Answers1