Passing Function As Two Way Binding Re-triggers $digest - Infinite Loop

I need to pass in a value from a parent directive (bound to controller X) to a child directive, update it, then pass it back all the way to the controller X updateItem function. T

Solution 1:

I believe your problem is that you're calling the update in your link function. So, you're updating the item, which causes the view to update, which causes a digest cycle and then you're looping forever.

Your approach doesn't make any sense. If your parent controller has the function that's going to update your item, why are you bothering to bind the function at all? Just bind item and let the parent controller handle the updating without trying to "pass it" back and forth. Whatever is bound to the attributes is coming from the parent, so just add it to item directly in the update function as parameters.

You're overcomplicating what is a simple binding solution by trying to call the parent controller's update method from the child instead of just letting the two-way binding do it's magic on item.

Solution 2:

If your child directive taking care to update the value and passed it back parent then you don't need two way binding with =.

You can use one way binding with <

scope: {
      itemToUpdate: '<', // use one way binding
      updateItem: '=',
    }

EDIT :

My bad : You already having two way data binding,you dont need to pass it back from child directive.

scope.updateItem(scope.itemToUpdate);. //not needed

It will automatically available there.