Svg animate - How to trigger the animation each time the item changes of state

Hello,

I use a Habpanel where I included a template containing the .svg file. This one is my ground-floor and also contains simple animations ( light switch ON->OFF; OFF->ON). The problem is that the animation works only once at the loading of the page … Afterwards I only have the final status of the animation without the animation itself …
Here below piece of my .svg file … ( I use “ng-if” directive to make the distinction between the 2 animations (from ON->OFF , or the inverse )
Can somebody has a trick to trigger once again the animation each time the item’s status changes ? I’m stuck …
THanks a lot for your ideas … ,

Regards,

Fr,

    <g
       id="g3419">
      <circle
         id="circle3417"
         r="128"
         cy="184.008"
         cx="256.00201"
		 stroke="#000000"
         stroke-width="4.99587822"
         stroke-miterlimit="9.98421097"
         stroke-dasharray="none"
         stroke-opacity="1"			 
         fill="#ffe671"> 
         <animate ng-if="(itemState('C948S2_Ecl_central_Sam') == 'ON')" attributeName="fill" attributeType="XML" from="#ffffff" to="#ffe671" dur="5s" fill="freeze" /> 
		 <animate ng-if="(itemState('C948S2_Ecl_central_Sam') == 'ON')" attributeName="stroke-opacity" attributeType="XML" from="1" to="0" dur="5s" fill="freeze" />
         <animate ng-if="(itemState('C948S2_Ecl_central_Sam') == 'OFF')" attributeName="fill" attributeType="XML" from="#ffe671" to="#ffffff" dur="5s" fill="freeze" /> 
		 <animate ng-if="(itemState('C948S2_Ecl_central_Sam') == 'OFF')" attributeName="stroke-opacity" attributeType="XML" from="0" to="1" dur="5s" fill="freeze" /> 
					
		</circle>
    </g>

Would an ng-bind do the trick?