Aframe animation component not removing

Question

I have attempted a few ways to remove the animation (from the html attribute itself):

element.components["animation__0"].remove(); 
//above works, but has no affect on html list, just "stops" animation.  

delete element.components.animation__0;
//works, in theory but html attribute still there

$("#id").removeAttr("animation__0"); //results in the error below:

aframe-animation-component.js:468 Uncaught TypeError: Cannot read property '2' of null(…)
getUnit @   aframe-animation-component.js:468
getValidValue   @   aframe-animation-component.js:523
getTweenValues  @   aframe-animation-component.js:584
(anonymous function)    @   aframe-animation-component.js:601
(anonymous function)    @   aframe-animation-component.js:594
getTweensProps  @   aframe-animation-component.js:592
getTweens   @   aframe-animation-component.js:614
createAnimation @   aframe-animation-component.js:755
animation   @   aframe-animation-component.js:784
update  @   aframe-animation-component.js:128
updateProperties    @   component.js:211
value   @   a-entity.js:446
value   @   a-entity.js:607
attr    @   jquery.js?hash=22a0055…:8028
removeAttr  @   jquery.js?hash=22a0055…:8068
(anonymous function)    @   jquery.js?hash=22a0055…:7991
each    @   jquery.js?hash=22a0055…:442
each    @   jquery.js?hash=22a0055…:194
removeAttr  @   jquery.js?hash=22a0055…:7990
(anonymous function)    @   VM8102:1

I have also tried to flushToDOM() after deleting components etc... Didn't seem to change any html

Code Pen: http://codepen.io/msj121/pen/yVVmvL

thoragio thoragio · Accepted Answer · 2016-11-18T08:18:12

Take a look at this fork of your pen: http://codepen.io/thoragio/pen/xRgKBQ

I replaced cylinder.components["animation__scale"].remove(); with cylinder.removeAttribute("animation__scale"); and the DOM is now being updated.

Also, the first console.log() needs to be outside of the setTimeout() method or else you are just calling them both at the same time.

Aframe animation component not removing

1 Answers