javascript - angularjs ngblur does not take effect but onblur takes effect, why?

Question

<input class="detail-reply"
        id="replyInput"
        type="text"
        ng-model="$ctrl.replyString">

This input will not be triggered using ng-blur, but the direct DOM binding onblur event will be triggered. Why?

Answer 1

Are you using 1 or 2? If it is 2, you can
<input type="text" [(ngModel)]="myModel" (blur)="onBlurMethod()">

export class AppComponent { 
  myModel: any;
  constructor(){
    this.myModel = '123';
  }
  onBlurMethod(){
   alert(this.myModel) 
  }
}

Answer 2

angular1’s ng-blur can only be used through instructions. The function of the instructions is actually to apply the event bound by ng-blur to the onblur event

app.directive('ngBlur', ['$parse', function($parse) {
  return function(scope, element, attr) {
    var fn = $parse(attr['ngBlur']);
    element.bind('blur', function(event) {
      scope.$apply(function() {
        fn(scope, {$event:event});
      });
    });
  }
}]);