Firstly, I’d like to point out that I’m new to both AngularJS and Ionic. However, I think I’m grasping the basic concepts quite easily.
I have a problem, and I think I know what’s causing it - but I don’t know the best way of solving the problem.
Basically, I have a custom directive called
<bars>. It gets replaced, and becomes a simple animated bar chart.
It works perfectly fine, until I switch to another view that also has the custom directive.
Instead of adding the new bar chart data to the new
<bars> directive (from my new view), it’s instead adding to my previous view, as the page is swiping left.
I think it’s because of the way Ionic slides from one view to the next (which I like). I think the previous view isn’t triggering the
$destroy event until the new view has loaded. BUT my directive is trying to render before the
$destroy event, which is causing my new bar chart data to be added to the previous view, and not my new view.
Does that make sense?
Solutions I’ve tried, but I’m not happy with
I’ve manually triggered the $destroy event with an ng-click. It worked, but then it doesn’t look very nice when transitioning from one view to the other.
I’ve also tried adding another directive, but that goes against the DRY concept I’m trying desperately to adhere to.
I’m not using jQuery, as it sorta contradicts AngularJS - but if I was, I’d use something like
$('bars').last(). As it would always apply to last
<bars> found, but I realise Angular doesn’t quite work like that.
Any solutions? I’m sure it’s staring me right in the face.