angularjs: force re-rendering/ full refresh a directive template [closed]

Question

This is a rewriting because of the off-topic issue:

I wrote a directive for a dropdown. I am using the directive two times as kind of a workflow. the first dropdown triggers by change action the refresh of the model of the second one. though the model updates correctly, the view does not. the many times you select items in dropdown one the second dropdown shows old items with new items, eventhough the console.log() of the angular model is correct.

the view has infinite recursion. Using ng-include with an id of a ng/template that does recursion about it self:

my initial plunkr showing the template code is this: http://plnkr.co/edit/jera17uCluGsFs8o5hRG?p=preview

I did not understand why the view does not fully refresh?

to be updated.

kind regards, alex

Answer 1

Typically what I do is use ui-if directive which is basically an if statement made by angularui team so I'll put it on the element that is also the directive and say something like:

<div ui-if="mydata.prop" my-custom-directive></div> 

This way if myData.prop changes or I set it to null briefly then reapply it it will remove and then transclude my html directive back into the DOM causing it to eval my directive again.