Angulaire 4 PrimeNg Arbre Copier et déposer Copie à

Question

J'ai travaillé avec le module Tree de PrimeNg pendant quelques jours et j'ai écrit des fonctionnalités personnalisées pour presque tout ce que je veux faire. Cependant, j'ai toujours des problèmes avec la référence d'objet dans ma fonction copyTo personnalisée en raison des rappels appelés post-manipulation. Donc, je suis à la recherche d'une façon élégante d'interrompre les gestionnaires glisser-déposer afin que je puisse copier en profondeur les données pour un contrôle plus granulaire. Je pense que je devrais envisager d'étendre la classe pour pouvoir remplacer les fonctions du plugin, mais je ne suis pas sûr que cela causera plus de dommages sur la ligne lors de la mise à niveau.

Des conseils ou des suggestions «Comment faire» sont très appréciés!

Le code ci-dessous prend un élément avec un index connu et le réinsère dans l'arbre à partir duquel il a été tiré, copiant ainsi d'un arbre à l'autre. Cependant cela ne fonctionne que pour les index connus et ne supporte pas les profondeurs variables des nœuds imbriqués.

copyToTree: any = []; // tree obj cache 
    staticTree: any = []; // tree obj cache 

    // Fires when node is dropped on copyToTree 
    dropOnCopyTo(event: any) { 
     let dragged: any = event.dragNode; 

     if(dragged.field_name == null) { // dragged from staticTree 
      // re-add copy to correct position in staticTree 
      let copy: any = this.deepCopy(dragged); 
      this.staticTree.children.splice(copy.index, 0, copy); 
      // Update field_name of dragged in copyToTree 
      dragged.field_name = 'new_' + Date.now(); 
     } 
    } 

Answer 1

Après avoir travaillé avec un autre développeur, nous avons trouvé que nous avions juste besoin d'une copie en profondeur appropriée qui pourrait gérer référence circulaire en raison du tableau TreeNode.parent.children contenant la référence de l'objet TreeNode d'origine.

public deepCopy(oldObj: any) { 
    // Using jquery for its extensive error checking 
    return $.extend(true, {}, oldObj); 
} 

Cela a permis TreeNode à raccorder de nouveau dans le « de » arbre sans référence d'objet étant lié à elle.