각도 4 하위 구성 요소의 항목을 삭제 한 후 상위 구성 요소를 업데이트하는 방법

Question

상위 구성 요소 (마스터)에 항목 목록이 있고 사용자가 항목 중 하나를 클릭하면 다른 구성 요소 (하위/세부 정보)가 같은 페이지에 있습니다. 선택한 항목의 세부 정보를 보여줍니다. 선택한 항목을 데이터베이스에서 삭제하는 하위 구성 요소의 삭제 단추가 있습니다.

내 질문에 어떻게 하위 구성 요소에서 항목을 삭제 한 후 상위 구성 요소의 항목 목록을 업데이트 할 수 있습니까?

부모 요소 :

export class ProjectListComponent implements OnInit { 

    projects : Project[]; 
    selectedProject: Project; 

    constructor(private _projectService: ProjectService) { } 

    ngOnInit() { 
    this.projects = []; 
    this.fetchListOfProjects(); 
    } 

    fetchListOfProjects(){ 
    this._projectService.getProject() 
     .subscribe(projects => { 
      this.projects = projects; 
     }) 
    } 

    onSelect(project: Project): void { 
    this.selectedProject = project; 
    } 
} 

하위 구성 요소 :

export class ProjectItemComponent implements OnInit { 
@Input() project: Project; 
constructor(private _projectService:ProjectService) { } 

ngOnInit() { } 

onDelete(id:any){ 
    if(confirm("Are you sure to delete the project?")) { 
    this._projectService.deleteProject(id) 
     .subscribe(result =>{   
     if(result.status == 204){ 
      console.log('removed'); 
     }; 
     }); 
    }  
} 
} 

Answer 1

export class ProjectItemComponent implements OnInit { 
@Input() project: Project; 
constructor(private _projectService:ProjectService) { } 

@Output() 
someEvent = new EventEmitter(); 

ngOnInit() { } 

onDelete(id:any){ 
    if(confirm("Are you sure to delete the project?")) { 
    this._projectService.deleteProject(id) 
     .subscribe(result =>{   
     if(result.status == 204){ 
      console.log('removed'); 
      this.someEvent.emit(null); 
     }; 
     }); 
    }  
} 

<project-item (someEvent)="update()" 

이 방법 update()는 항목이 아이에 삭제 부모, 호출됩니다.