删除元素后更新列表
Update List after deleting an element
我有一个用 JHipster 5.5.0 生成的项目,我有 2 个实体:parent & child.
当我看到parent的详细信息时,我列出了children。当我想删除 child 时,我使用 child 的模态,它可以正常工作。
我的问题是删除实体后列表没有更新,我不知道去哪里找。我尝试使用静态方法以便重新加载列表,但我无法这样做。任何帮助将不胜感激。
Child的Angular代码:
import { Component, OnInit, OnDestroy } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { NgbActiveModal, NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
import { JhiEventManager } from 'ng-jhipster';
import { IChild } from 'app/shared/model/child.model';
import { ChildService } from './Child.service';
@Component({
selector: 'jhi-child-delete-dialog',
templateUrl: './child-delete-dialog.component.html'
})
export class ChildDeleteDialogComponent {
child: IChild;
constructor(
private childService: ChildService,
public activeModal: NgbActiveModal,
private eventManager: JhiEventManager
) {}
clear() {
this.activeModal.dismiss('cancel');
}
confirmDelete(id: number) {
this.childService.delete(id).subscribe(response => {
this.eventManager.broadcast({
name: 'childtModification',
content: 'Deleted a child'
});
this.activeModal.dismiss(true);
});
}
}
@Component({
selector: 'jhi-child-delete-popup',
template: ''
})
export class ChildDeletePopupComponent implements OnInit, OnDestroy {
private ngbModalRef: NgbModalRef;
constructor(private activatedRoute: ActivatedRoute, private router: Router, private modalService: NgbModal) {}
ngOnInit() {
this.activatedRoute.data.subscribe(({ child }) => {
setTimeout(() => {
this.ngbModalRef = this.modalService.open(ChildDeleteDialogComponent as Component, {
size: 'lg',
backdrop: 'static'
});
this.ngbModalRef.componentInstance.child = child;
this.ngbModalRef.result.then(
result => {
this.router.navigate([{ outlets: { popup: null } }], { replaceUrl: true, queryParamsHandling: 'merge' });
this.ngbModalRef = null;
},
reason => {
this.router.navigate([{ outlets: { popup: null } }], { replaceUrl: true, queryParamsHandling: 'merge' });
this.ngbModalRef = null;
}
);
}, 0);
});
}
ngOnDestroy() {
this.ngbModalRef = null;
}
}
在 parent 实体中,我有一个这样的按钮:
<button type="submit" [routerLink]="['/', { outlets: { popup: 'child/'+ child.id + '/delete'} }]"
replaceUrl="true"
queryParamsHandling="merge"
class="btn btn-danger btn-sm">
<fa-icon [icon]="'times'"></fa-icon>
<span class="d-none d-md-inline" jhiTranslate="entity.action.delete">Delete</span>
</button>
删除child的模态组件都没有被修改
寻找相同答案的人:
删除子项时,组件广播事件如下:
this.eventManager.broadcast({
name: 'childListModification',
content: 'Deleted a Child'
});
我只需要(在父组件中)订阅这样的事件:
registerChangeInChildren() {
this.eventSubscriber = this.eventManager.subscribe('childListModification', response => {
this.getAll();
});
}
并在 ngOnInit()
中调用 this.registerChangeInChildren()
,一切正常。
我有一个用 JHipster 5.5.0 生成的项目,我有 2 个实体:parent & child.
当我看到parent的详细信息时,我列出了children。当我想删除 child 时,我使用 child 的模态,它可以正常工作。
我的问题是删除实体后列表没有更新,我不知道去哪里找。我尝试使用静态方法以便重新加载列表,但我无法这样做。任何帮助将不胜感激。
Child的Angular代码:
import { Component, OnInit, OnDestroy } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { NgbActiveModal, NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
import { JhiEventManager } from 'ng-jhipster';
import { IChild } from 'app/shared/model/child.model';
import { ChildService } from './Child.service';
@Component({
selector: 'jhi-child-delete-dialog',
templateUrl: './child-delete-dialog.component.html'
})
export class ChildDeleteDialogComponent {
child: IChild;
constructor(
private childService: ChildService,
public activeModal: NgbActiveModal,
private eventManager: JhiEventManager
) {}
clear() {
this.activeModal.dismiss('cancel');
}
confirmDelete(id: number) {
this.childService.delete(id).subscribe(response => {
this.eventManager.broadcast({
name: 'childtModification',
content: 'Deleted a child'
});
this.activeModal.dismiss(true);
});
}
}
@Component({
selector: 'jhi-child-delete-popup',
template: ''
})
export class ChildDeletePopupComponent implements OnInit, OnDestroy {
private ngbModalRef: NgbModalRef;
constructor(private activatedRoute: ActivatedRoute, private router: Router, private modalService: NgbModal) {}
ngOnInit() {
this.activatedRoute.data.subscribe(({ child }) => {
setTimeout(() => {
this.ngbModalRef = this.modalService.open(ChildDeleteDialogComponent as Component, {
size: 'lg',
backdrop: 'static'
});
this.ngbModalRef.componentInstance.child = child;
this.ngbModalRef.result.then(
result => {
this.router.navigate([{ outlets: { popup: null } }], { replaceUrl: true, queryParamsHandling: 'merge' });
this.ngbModalRef = null;
},
reason => {
this.router.navigate([{ outlets: { popup: null } }], { replaceUrl: true, queryParamsHandling: 'merge' });
this.ngbModalRef = null;
}
);
}, 0);
});
}
ngOnDestroy() {
this.ngbModalRef = null;
}
}
在 parent 实体中,我有一个这样的按钮:
<button type="submit" [routerLink]="['/', { outlets: { popup: 'child/'+ child.id + '/delete'} }]"
replaceUrl="true"
queryParamsHandling="merge"
class="btn btn-danger btn-sm">
<fa-icon [icon]="'times'"></fa-icon>
<span class="d-none d-md-inline" jhiTranslate="entity.action.delete">Delete</span>
</button>
删除child的模态组件都没有被修改
寻找相同答案的人:
删除子项时,组件广播事件如下:
this.eventManager.broadcast({
name: 'childListModification',
content: 'Deleted a Child'
});
我只需要(在父组件中)订阅这样的事件:
registerChangeInChildren() {
this.eventSubscriber = this.eventManager.subscribe('childListModification', response => {
this.getAll();
});
}
并在 ngOnInit()
中调用 this.registerChangeInChildren()
,一切正常。