Javascript 如何在Angular 6中的Angular Material对话框中将数据传递到afterClosed（）

我试图将对话框中的数据传递回用户从中打开对话框的组件。我的简单例子如下：

测试组件.ts

从“/../x-dialog/x-dialog.component”导入{xDialogComponent}；
从“/x-filter”导入{xFilter}；
从“/../database.service”导入{xLevelResult，xmodelResult，xpayResult，xpayClassResult，xSpResult}；
从“@angular/core”导入{Component，OnInit}；
从“@angular/forms”导入{FormArray、FormControl、FormGroup、Validators}；
从“../database.service”导入{databaseService，xSigResult，xOutResult，CurxpayResult}；
从'@angular/common/http'导入{HttpClient}；
从“@angular/common/src/directives/ng_if”导入{NgIf}”；
从“量角器”导入{element}；
从'@angular/router'导入{ActivatedRoute}；
从“../database.service”导入{MakeGroup、xpayteamResult、xpayteamSPResult、NoticeResult}；
从“../database.service”导入{DateResult}；
从“@angular/common”导入{DatePipe}；
从'@angular/Router'导入{Router}；
从“@angular/material/sort”导入{MatSortModule}；
从“@angular/platform browser/animations”导入{BrowserAnimationsModule}；
从“@angular/material”导入{MatButtonModule，MatCheckboxModule}；
从“@angular/material/tabs”导入{MatTabsModule}；
从“rxjs”导入{Observable，forkJoin}；
从“rxjs/operators”导入{mergeMap、expand、map、flatMap、concat、switchMap、combineAll}；
从“@angular/material/grid list”导入{MatGridListModule}；
从“@angular/material/form field”导入{MatFormFieldModule}；
从“@angular/material”导入{MatInputModule，MatTableModule，MatPaginatorModule}；
从'@angular/forms'导入{FormsModule}；
从“@angular/material”导入{matsnakbar}；
从“/../../Make.service”导入{MakeService}；
从“@angular/material/dialog”导入{MatDialogModule}；
从“@angular/material/DIALOG”导入{MatDialogRef，MAT_DIALOG_数据，MatDialog}；
@组成部分({
选择器：“app-x”，
templateUrl:“./x.component.html”，
样式URL:['../style.css']
})
导出类xComponent实现OnInit{
MakeGroups:MakeGroup[]；
结果：阵列；
xmodelresults：数组；
xsigresults：数组；
curxpayresults：数组；
xpayresults：数组；
xpayclassresults：数组；
xpayteamresults：数组；
xpayteamspresults：数组；
最终结果：任意[]=[]；
x_sp_结果：数组；
注意结果：数组；
modelName:string；
TransactionDate:字符串；
MakeName:string；
删除：字符串；
日期选择：字符串；
注：编号；
selectedEffect：编号；
//残疾人
SubmitDisabled：布尔值；
禁用的数量：布尔值；
已禁用日期：布尔值；
ISDisabled：布尔值；
模型禁用：布尔；
SIG禁用：布尔值；
编辑开关：布尔；
下一个开关：布尔；
//SP调用的选择变量
selectedLevel：数字；
所选装载：编号；
selectedmodelNbr：编号；
selectedClassId:编号；
Advteam\u DRAW\u Return:编号；
selectedSigId：编号；
//SP呼叫
xspcall:string；
//日期变量
日期：日期；
selectedDate=''；
成功：布尔；
明天：数字；
yformat=''；
//x杰出
xoutresults：数组；
x：数字；
建造师(
专用数据库服务：数据库服务，
专用路由：激活的路由，
专用路由器：路由器，
私人MakeService:MakeService，
公共对话框X:MatDialog，
公共快餐店：Matsnakbar
) {}
//根据用户选择更改selectedLevel变量的实际值
更改级别（xLevelresult:xLevelresult）{
//禁用以确保用户输入正确的数据
this.SubmitDisabled=true；
this.DateDisabled=true；
this.sigdabled=true；
this.xpayresults=[]；
this.xsigresults=[]；
this.selectedDate=未定义；
this.selectedSigId=未定义；
this.xpayclassresults=[]；
this.xpayteamresults=[]；
this.xpayteamspresults=[]；
this.curxpayresults=[]；
this.FinalArray=[]；
this.selectedAmount=未定义；
this.selectedLevel=（xLevelresult？xLevelresult.Make_Level_Id:1）；
console.log（此.selectedLevel）；
//“填充模型”下拉列表
const id=this.route.snapshot.paramMap.get（'id'）；
this.databaseService.getxmodel（id，this.selectedLevel）
.subscribe（xmodelresults=>this.xmodelresults=xmodelresults）；
}
//根据用户选择更改selectedmodelNbr变量的实际值
更改模型（xmodelresult:xmodelresult）{
this.SubmitDisabled=true；
this.DateDisabled=true；
this.sigdabled=true；
this.selectedDate=未定义；
this.xpayresults=[]；
this.xsigresults=[]；
this.selectedSigId=未定义；
this.xpayclassresults=[]；
this.xpayteamresults=[]；
this.xpayteamspresults=[]；
this.curxpayresults=[]；
this.FinalArray=[]；
this.selectedAmount=未定义；
this.selectedmodelNbr=（xmodelresult？xmodelresult.model\u Nbr:1）；
console.log（this.selectedmodelNbr）；
}
////根据用户选择更改selectedAmount变量的实际值
changedAmount（事件：任何）{
if（this.editswitch===true）{
this.SubmitDisabled=true；
this.DateDisabled=true；
this.selectedAmount=event.target.value；
this.xpayresults=[]；
this.xpayclassresults=[]；
this.xpayteamresults=[]；
this.xpayteamspresults=[]；
this.curxpayresults=[]；
this.FinalArray=[]；
const id=this.route.snapshot.paramMap.get（'id'）；
//更改所有值
this.selectedDate=this.xoutresults[this.x].Calc_Dt；
this.selectedLevel=this.xoutresults[this.x].Make\u Level\u Id；
this.selectedmodelNbr=this.xoutresults[this.x].model\u Nbr；
//填充表单数据
this.databaseService.getxLevel（id）
.subscribe（xLevelresults=>this.xLevelresults=xLevelresults）；
this.databaseService.getxmodel（id，this.selectedLevel）
.subscribe（xmodelresults=>this.xmodelresults=xmodelresults）；
this.databaseService.getxSig（id，this.selectedLevel，thi
export class TestDialogComponent implements OnInit {

  id: string;
  nextresults: Array<NextResult>;
  closeMessage: string = "";      

  constructor(
    ...
    public dialogRef: MatDialogRef<TestDialogComponent>, 
    ...) { }

  onClose(): void {
    // set the closeMessage property here
    this.closeMessage = "Pizza!";
    this.dialogRef.close('ref');
  }
  ...
}

openDialog() {
  const id = this.route.snapshot.paramMap.get('id');
  const dialogRef = this.dialog.open(TestDialogComponent, {
    width: '880px'    });
    dialogRef.componentInstance.id = id;

  dialogRef.afterClosed().subscribe(result => {
    console.log('The dialog was closed');
    // reference the closeMessage property here
    console.log(dialogRef.componentInstance.closeMessage);
  });
}

addWorksheet(): void {
    this.dialogRef = this.dialog.open(CreateWorksheetComponent, { width: '400px' });
    this.afterClosed();
  }
  private afterClosed(): void {
    this.dialogRef.afterClosed().subscribe((worksheetName: string) => {
      console.log(worksheetName)
      this.createWorksheet(worksheetName);
    });
  }

createWorksheet(): void {
    if (this.worksheetName.valid) {
      this.dialogRef.close(this.worksheetName.value);
    }
  }

  errorMessage(): void {
    return Config.ErrorMessages.InvalidWorksheetName;
  }

  cancel(): void {
    this.dialogRef.close();
  }

<div>
  <mat-form-field class="example-full-width">
    <input matInput placeholder="Ansichtiname" [formControl]="worksheetName">
    <mat-error *ngIf="worksheetName?.invalid">{{errorMessage()}}</mat-error>
  </mat-form-field>
</div>
<mat-card-actions>
  <button mat-button (click)="cancel()">Abbrechen</button>
  <button mat-button (click)="createWorksheet()" [disabled]="worksheetName?.invalid">Speichern</button>
</mat-card-actions>