Angular indeterminate checkbox directive ng-change issue

I am trying to implement the angular data-indeterminate-checkbox directive in my application from the link below-

Example Fiddle

I have added ng-change to both the parent and the children checkboxes (same event) which updates the columns in a table below. The problem is when i check/uncheck the child checkboxes, the columns appear and dissapear fine and it works ok, but when i click the select all checkbox, the action is inverted. That is, when select all is checked, all columns hidden and when unchecked, all columns are visible.

In the snippet for the directive from the fiddle link mentioned above, in the else part, if i change the modelCtrl.$setViewValue(hasChecked); to modelCtrl.$setViewValue(true);, the uncheck part works, i.e when i uncheck 'Select All', all columns are hidden but when i check it, nothing happens and it does not go to the ng-change event. Any help is much appreciated.

Thanks in advance and Happy New Year 2016!!

// Determine which state to put the checkbox in

            if (hasChecked && hasUnchecked) {
                element.prop('checked', false);
                element.prop('indeterminate', true);
                if (modelCtrl) {
                    modelCtrl.$setViewValue(false);
                }
            } else {
                element.prop('checked', hasChecked);
                element.prop('indeterminate', false);
                if (modelCtrl) {
                    modelCtrl.$setViewValue(hasChecked);
                }
            }
        }, true);