0

lo que quiero hacer es mover un elemento de un array a otro, pero solo los que seleccione el usuario y sin JQuery, estoy en Angular 4, les dejo mi código.texto en negrita

    <div class="create-cont-top-left">
          <h5 class="clrGrayBlack">Lista de campus:</h5>
          <div class="cont-text">
            <p *ngFor="let campus of campuses">{{campus}}</p>
          </div>
        </div>
      <div (click)="addItem()" class="font">
            <i class="fa fa-plus" style="color: green"></i>
            <a>Agregar</a>
          </div>

  addItem(){
    let _ = this;

    for (let i = 0; i < _.campuses.length; i++){
      console.log(_.campuses[i]);
      _.campusesAggregates.push(_.campuses[i]);
      delete _.campuses[i];
      console.log(_.campusesAggregates[i]);
    }

    // console.log(_.campusesAggregates[i]);
    return;
  }

2 respuestas 2

1

Debes usar el *ngFor y pasar el index para obtener rapidamente el elemento.

Primero recorres en un ngFor

<p (click)="addItem(i,campus)" *ngFor="let campus of campuses; let i=index">
  {{campus}}
  <a class="cursor-pointer green">+</a>
</p>

Luego recibes en una función.

addItem(index:number,item:string){
  this.selected.unshift(item);
  this.campuses.splice(index,1);
}

Te dejo un ejemplo de como pasar elementos de una vector a otro.

Ejemplo

0

Pasa el campus a mover directamente por el método:

addItem(toMove: Campus): void {
  const index = this.campuses.findIndex((c: Campus) => c.key === toMove.key);
  this.campuses.splice(index, 1); // eliminamos el campus del array original
  this.campusesAggregates.push(toMove); // lo agregamos al array origen
}

Y en el HTML:

<div (click)="addItem(campus)" class="font">
  <i class="fa fa-plus" style="color: green"></i>
  <a>Agregar</a>
</div>
2
  • No me funciono :C Me dice que key no esta definida Commented el 26 sept. 2018 a las 18:07
  • @EduardoGarcía Donde dice key es el campo por donde debes buscar. Puede ser id, nombre, etc.
    – gugadev
    Commented el 26 sept. 2018 a las 18:12

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.