Load sprites dynamically instead to load all at begining

[Vcode]

Hi all, i'm having some troubles with loader and sprites....

I load all my general purpose sprites at begining without problems, they works fine, the problem appears when i try to load a new sprite when i press a button. I need to load a new "rotating planet skin" when  a button is pressed.

for my general purpose textures i load them like this..

var ef_circulo = [];
var ef_transicion = [];
const ef_energia = [];
var textura_ef_circulo,textura_ef_transicion,textura_ef_energia;
var ef_planeta = [];
var textura_ef_planeta;

const cargador = new PIXI.Loader();

cargador.add('circulo', 'img/ef_circulo.json')
        .add('transicion','img/efectos/transic.json')
        .add('energia','img/efectos/energia2.json')       
        .load(efectos_cargados);

function efectos_cargados() {

        // create an array to store the textures
        var i;

        for (i = 0; i < 74; i++) {
            textura_ef_circulo = PIXI.Texture.from('ef_circulo_' + (i) + '.png');
            ef_circulo.push(textura_ef_circulo);
        }
        var explosion = capa_flotas.addChild(new PIXI.AnimatedSprite(ef_circulo));
        explosion.anchor.set (0.5,0.5);
        explosion.pivot.set (0.5,0.5);
        explosion.gotoAndPlay(0);
        explosion.scale.set(1);
        explosion.rotation = (90*3.1416)/180;
        explosion.position.set (175, 35);
        explosion.animationSpeed = 0.4;

        for (i = 0; i < 25; i++) {
            textura_ef_transicion = PIXI.Texture.from('transicion_' + (i) + '.png');
            ef_transicion.push(textura_ef_transicion);
        }
        transicion = sistemas.addChild(new PIXI.AnimatedSprite(ef_transicion));
    

        transicion.scale.set(1);
        transicion.width =1024;
        transicion.height = 200;
        transicion.animationSpeed = 0.8;
        transicion.loop = true;

        // cargo las imagenes del efecto de energia
        for (i = 123; i > 0; i--) {
            //textura_ef_energia = PIXI.Texture.from('energia_' + (i) + '.png');
            textura_ef_energia = PIXI.Texture.from('energia2_' + (i) + '.png');
            ef_energia.push(textura_ef_energia);
        }
}    

The previous code load some sprite textures for spaceships, stars....

Now i need to load 9 (for 9 planets on that star) new sprites depending on the star button pressed, and i'm trying this but didn`t work at all

    for (var i = 0; i < sistema_solar.planetas.length; i++){
    
      if(sistema_solar.planetas[i].nom_jug.length != 0){
       planetas[i] = new Planeta(...more data here,sistema_solar.planetas[i].img_planeta);   
       }
    }

function Planeta(some variables here,imagen_planeta) {
  
...more stuff here  

   var loaderNumberNine = new PIXI.Loader();
     
     //loaderNumberNine.add('planeta_g', 'img/sistema/p1.json');
     loaderNumberNine.add('planeta_g', imagen_planeta);
     loaderNumberNine.load(function(loader, resources) {  
       /*thats onload for you*/ 
       var i;
       for (i = 0; i < 149; i++) {
        textura_ef_planeta = PIXI.Texture.from('p1_' + (i) + '.png');
        ef_planeta.push(textura_ef_planeta);
      }

      });

...more stuff here

and i put the new sprite into a container.

 this.planet = cont_sistema.addChild(new PIXI.AnimatedSprite(ef_planeta));
 this.planet.play();   
 this.planet.animationSpeed = 0.25;

...more stuff here

}

it works but not as espected...

if i use 

loaderNumberNine.add('planeta_g', 'img/sistema/p1.json');

i alwais have the same planet skin 

if i use

loaderNumberNine.add('planeta_g', imagen_planeta);

where imagen_planeta is 'img/sistema/p1.json' or 'img/sistema/p2.json', or 'img/sistema/p3.json'..

 it alwais load the first .json on the 9 sprites

any help whould be much apreciated

Edit: i forgot to mention i'm using PixiJS 5.3.6 

Edited December 28, 2020 by Vcode
forgot to mention the pixi version

[Vcode]

MODs can close this thread, I solved it loading all at beginning and reducing numbers of objects needed.