cuadro.component.ts
Tengo un problema,estoy tratando de eliminar un dato
<ul>
<li *ngFor="let user of users">
<p @heroState='user.state' (click)="user.toggleState()">{{user.name}}</p>
<p>{{user.state}}</p>
<button (click)="remove(user)"> Eliminar </button>
</li>
</ul>
export class CuadroComponent {
@Input() users:EjemploService;
@Output() evento=new EventEmitter();
...
}
//app.component
selector: 'my-app',
template: `Prueba angular2.0</h1>
<p>Probando cuadro</p>
<button [disabled]="!users.canAdd()" (click)="users.addActive()">Añadir Activo</button>
<button [disabled]="!users.canAdd()" (click)="users.addActive()" >Añadir Inactivo</button>
<button [disabled]="!users.canRemove()" (click)="users.remove()" >Remover </button>
<cuadro [users]=users (evento)="evento($event)"></cuadro>
`,
ejemplo.service.ts
remove(user:User=null){
console.log("USER A REMOVER==",user)
if(user==null){
this.items.splice(this.items.length-1,1);
}
else{
this.items=this.items.filter(u=>u!=user);
}
console.log("LISTA FINAL",this.items)
this.items.forEach(function(x,y){
console.log(x,y);
})
}
Me muestra una lista de usuarios ,al costado de c/u hay un boton , cuando presiono me elimina ese usuario , el detalle esta que me elimina mal ejemplo: 1 2 3 4
elimino el segundo y me elimina toda la tira de abajo , quedando. 1
he puesto el codigo concerniente a a esas partes,espero su ayuda, en cuanto a los usuarios que quedan , he puesto varios logs y veo que cuando elimino el usuario n , si me retorna todos los usuarios que deberian ir , pero estos no se muestran , sino solo los que estaban arriba del que elimine.
Como ven antes de eliminar. //
Luego de eliminar , al costado en un console ,me muestran los usuarios que quedan, pero estos no se reflejan en la directiva.