Hello, how are you? I'm creating a test project to learn how to handle angle 6 since I come from angularjs and I'm having a problem with the ngFof or with the variable that the ngFor traverses, I'm not sure but when I move from one component to another and then I go back to previous component the ngFor items are duplicated. The flow is as follows: - The Home page makes a get and with the ngFor it lists the data of my bd. - Then when entering an individual data I pass the id of that data to obtain information about this specific data by going to the project component. - When returning to the previous component the ngFor data is duplicated.
step gif here , this is the code that I have in the home.component.ts, the truth is that I'm not realizing that it could be
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { ProjectService } from '../../../service/project.service';
import { Observable } from 'rxjs';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
closeResult: string;
projects = [];
project = {};
constructor(private modalService: NgbModal, private projectService: ProjectService){
this.projects = [];
}
ngOnInit() {
this.projects = this.projectService.get();
}
openLg(content) {
this.modalService.open(content, { size: 'lg' });
}
modalProject(): Observable<any> {
let cb = Function;
this.projectService.add(this.project, callback=>{
this.projects.push(callback);
});
this.project = {};
return;
}
}Thanks greetings!