无法更改Aframe中按钮单击时的纹理

Question

我正在尝试使用注册组件加载gltf模型以更改按钮单击时的纹理。现在我可以按预期加载和显示模型。但是，单击按钮进行纹理更改时，我无法反映任何更改。

这是我尝试的内容

<div class=" radisi">
<input type='button' class='radmi rad1' value='next' /></div>

  <a-entity id="newmod" example gltf-model="src: url(model/straw.glb);"
              position="0 1.8 -1" scale="1,1,1"></a-entity>



    AFRAME.registerComponent('example', {

    init: function() {
    var el = this.el;
    el.addEventListener('model-loaded', function (e) {
    e.detail.model.traverse(function(child) {

        if (child instanceof THREE.Mesh){
             if (child.material.name == "Craem")  {
             material.map =   new THREE.TextureLoader().load( "assets/img/choco.png" );
                       }
                    }
                });
             })
          }
      },3000)

注册组件后，我试图在点击

上访问纹理更改

$(".radisi").click(function(){

var el = this.el;
        el.addEventListener('model-loaded', function (e) {
        e.detail.model.traverse(function(child) {

            if (child instanceof THREE.Mesh){
                 if (child.material.name == "Craem")  {
                 material.map =   new THREE.TextureLoader().load( "assets/img/tri.png" );
                           }
                        }
                    });
                 })
});

它表示未定义的addEventListener。 请告诉我我错过的地方。谢谢。