Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.
Closed
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
fix:(input) asynchronous ng-model blur
If the model is blurred during an apply it should trigger the $touched
asynchronously.

Fixes #8762
  • Loading branch information
alexanderchan committed Oct 27, 2014
commit cb540c71a76dba6285ad05e582781a04816d573b
11 changes: 8 additions & 3 deletions src/ng/directive/input.js
Original file line number Diff line number Diff line change
Expand Up @@ -2460,9 +2460,14 @@ var ngModelDirective = function() {
element.on('blur', function(ev) {
if (modelCtrl.$touched) return;

scope.$apply(function() {
modelCtrl.$setTouched();
});
var onBlurSetTouched = function() {
modelCtrl.$setTouched();
};
if (scope.$$phase) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Narretz means $rootScope.$$phase (just clearing it up to avoid confusion 😈).

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sounds good I'll try to update that. I followed 719c747#diff-eefe7d65b6795cba34d2b08a27ebf2beR63 which only checked scope.$$phase.

Just to help my understanding is there a reason $rootScope.$$phase isn't used there? @tbosch thanks!

Ahh, sorry I see now, it came afterwards I should have checked the most recent version. Thanks for the tips guys.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the clarification @gkalpak Why $rootScope is explained here: #8849 (comment)

scope.$evalAsync(onBlurSetTouched);
} else {
scope.$apply(onBlurSetTouched);
}
});
}
};
Expand Down
26 changes: 26 additions & 0 deletions test/ng/directive/inputSpec.js
Original file line number Diff line number Diff line change
Expand Up @@ -1144,6 +1144,32 @@ describe('ngModel', function() {
dealoc(element);
}));

it('should digest asynchronously on "blur" event if a apply is already in progress',
inject(function($compile, $rootScope) {

var element = $compile('<form name="myForm">' +
'<input name="myControl" ng-model="value" >' +
'</form>')($rootScope);
var inputElm = element.find('input');
var control = $rootScope.myForm.myControl;

$rootScope.$apply(function() {
expect(control.$touched).toBe(false);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there a specifc reason why the first two expects are inside the $apply block?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Narretz there is no specific reason for the two expects to be in there. Do you think it would be better to move them just before the apply block? I was just trying to ensure that the touched and untouched state remained exactly the same before and after the blur event.

expect(control.$untouched).toBe(true);

browserTrigger(inputElm, 'blur');

expect(control.$touched).toBe(false);
expect(control.$untouched).toBe(true);
});

expect(control.$touched).toBe(true);
expect(control.$untouched).toBe(false);

dealoc(element);
}));


it('should register/deregister a nested ngModel with parent form when entering or leaving DOM',
inject(function($compile, $rootScope) {

Expand Down