When creating a watch on Text box and Check box models to call a custom-defined function, I want to avoid calling the function during the initial loading of data. To achieve this, I am using a 'needwatch' flag inside the watch to determine when to call my function. Both the check box and Text boxes are placed inside a span element, so that clicking on the span will set the 'needWatch' flag to true. This ensures that the custom function is only called when that particular model is changed and not during the initial data loading. While this logic works fine for Text boxes and select drop downs, it fails for check boxes.
The issue arises because, for Text boxes, the span's ng-click event always triggers first before the watch function on the Text box model is fired. However, with check boxes, the order in which the watch function and ng-click event are triggered seems to be random. I want the span's ng-click event to always be triggered first for check boxes as well, before its model's watch function. Is this possible?
To see the issue in action and try changing values for both text boxes and check boxes, please visit this plunker.