角6:错误类型错误:无法读取属性“afterClosed”的未定义
我正在学习用角6.在这里我要加入一个新的客户/汽车/司机/预订或更新一个新的客户端/汽车/司机/预订后刷新组件的平均堆栈的应用程序。但是,增加一个新的值之后,显示出所有值的组件不更新或刷新(无法看到当时的电流值),但是当我部件之间的路线,然后再回到相同的组件,但是其更新并显示所有的值。
我使用afterClosed
MATDialog
的方法返回所有客户的价值,但有一个错误错误:无法读取属性“afterClosed”的未定义
如何解决呢?
这里是client ts
文件。
import {Component,OnInit} from '@angular/core';
import {MatDialog,MatDialogRef,MAT_DIALOG_DATA} from '@angular/material/dialog';
import { IClient} from './client';
import {Router,ActivatedRoute} from '@angular/router';
import {ToastrService} from 'ngx-toastr';
import {AddClientComponent} from './add-client/add-clientponent';
import {EditClientComponent} from './edit-client/edit-clientponent';
import {DialogService} from '../../dialog.service';
import {ClientService} from './client.service';
@Component({
selector: 'app-clients',
templateUrl: './clientsponent.html',
styleUrls: ['./clientsponent.css']
})
export class ClientsComponent implements OnInit {
public currentClient: IClient;
clients: any;
Client: any;
addClientDialogRef: MatDialogRef < AddClientComponent > ;
editClientDialogRef: MatDialogRef < EditClientComponent > ;
constructor(public dialog: MatDialog,
private dialogService: DialogService,
private clientService: ClientService,
private router: Router) {}
openAddClientDialog() {
this.dialogService.open(AddClientComponent, {
width: '500px'
});
}
openEditClientDialog(id) {
this.dialogService.open(EditClientComponent, {
width: '500px',
data: {
'id': id
}
})
}
closeAll() {
this.addClientDialogRef.afterClosed().subscribe(() => {
this.getAllClients();
});
}
ngOnInit() {
this.closeAll();
this.getAllClients();
}
getAllClients() {
this.clientService.getClients().subscribe((res) => {
console.log(res);
this.clients = res;
}, err => {
console.log(err);
});
}
deleteClient(id) {
this.clientService.deleteClient(id)
.subscribe(res => {
this.router.navigate(['./clients']);
this.ngOnInit();
}, (err) => {
console.log(err);
});
}
}
回答如下:
为了能够引用事件,如在对话框引用afterClosed()
,您需要保存open()
到各自引用的结果:
// ...
@Component({
selector: 'app-clients',
templateUrl: './clientsponent.html',
styleUrls: ['./clientsponent.css']
})
export class ClientsComponent implements OnInit {
public currentClient: IClient;
clients: any;
Client: any;
addClientDialogRef: MatDialogRef<AddClientComponent>;
editClientDialogRef: MatDialogRef<EditClientComponent>;
constructor(public dialog: MatDialog,
private dialogService: DialogService,
private clientService: ClientService,
private router: Router) { }
openAddClientDialog() {
this.addClientDialogRef = this.dialogService.open(AddClientComponent, {
width: '500px'
});
}
openEditClientDialog(id) {
this.editClientDialogRef = this.dialogService.open(EditClientComponent, {
width: '500px',
data: { 'id': id }
})
}
closeAll() {
this.addClientDialogRef.afterClosed().subscribe(() => {
this.getAllClients();
});
}
// ...
}
希望帮助!
评论列表(0)
- 暂无评论