Why do errors remain when clearing the date in the angular strap datepicker?

Question

Angular

<div class="datepicker-range" dynamic-locale-patch>
  <form name="formDatePicker">
    <div class="container">
      <div>
        <div class="datepicker-input">
          <div translate="brokerage_reports.from"></div>
          <div class="input" ng-class="$ctrl.from || 'inactive'">
            <input type="text"
                   bs-datepicker
                   date-format="dd.MM.yy"
                   ng-model="$ctrl.from"
                   data-max-date="{{ $ctrl.maxDate }}"
                   data-min-date="{{ $ctrl.minDate }}"
                   data-autoclose="1"
                   ng-change="$ctrl.change(formDatePicker)"
                   name="dateFrom"
                   data-start-week="{{$ctrl.getStartWeek()}}">
            <span class="fa fa-calendar input-icon" ng-click="$ctrl.iconOnClick($event)"></span>
          </div>
        </div>
        <div
          class="datepicker-input-error"
          ng-show="formDatePicker.dateFrom.$invalid"
          translate="datePicker.inputError"></div>
      </div>
      <div class="separate"></div>
      <div>
        <div class="datepicker-input">
          <div translate="brokerage_reports.to"></div>
          <div class="input" ng-class="$ctrl.to || 'inactive'">
            <input type="text"
                   bs-datepicker
                   date-format="dd.MM.yy"
                   ng-model="$ctrl.to"
                   data-max-date="{{ $ctrl.maxDate }}"
                   data-min-date="{{ $ctrl.minDate }}"
                   data-autoclose="1"
                   name="dateTo"
                   ng-change="$ctrl.change(formDatePicker)"
                   data-start-week="{{$ctrl.getStartWeek()}}">
            <span class="fa fa-calendar input-icon" ng-click="$ctrl.iconOnClick($event)"></span>
          </div>
        </div>
        <div
          class="datepicker-input-error"
          ng-show="formDatePicker.dateTo.$invalid"
          translate="datePicker.inputError"></div>
      </div>
    </div>
    <div
      class="datepicker-input-error"
      ng-show="$ctrl.error">{{$ctrl.errorText}}</div>
  </form>
</div>

I'm trying to clear the date:

$rootScope.$on('$localeChangeSuccess', function () {
      $ctrl.from = null;
    });

If the date is entered correctly, then everything works fine, if not, then the field is cleared, but errors remain and the field is invalid.
What could be the problem ?