bob bob - 11 months ago 52
AngularJS Question

IE11 - form.$submitted being set wronly on Angular button-component click

This plunker

I have Angular directive

that wraps 'button' element and I am passing over
to set button's
attribute and
function to run something.

My problem is that, only in IE11, parent form's $submitted flag is being set even when I am passing "button" via

<bl-button my-click="myJob(myform)" my-type="button">Save2</bl-button>

In Chrome or FF, as expected, $submitted is being set only when I am saying

I may be missing something here.

Edit: below is my directive:

.directive('blButton', function () {
return {
restrict: 'E',
transclude: true,
scope: {
myClick: '&', // myClick() returns promise
myType: '@' // by default 'button'
template: '<button type="{{myType1}}" ng-click="click()" ng-transclude></button>',
link: function (scope, elem, attrs) {

scope.myType1 = scope.myType || 'button'; = function () {
.then(function(data) {
console.log('resolved:', data);
}, function(data) {
console.log('rejected:', data);


Answer Source

I believe you're falling into this bug in AngularJS. The workaround, from that bug:

Workaround: Using ng-attr-type="{{someInterpolatedThing}}" fixes it.

Note that this is also listed in Angular's Internet Explorer Compatibility page.