Angular 4材质对话框将对象数组传递给对话框

时间:2017-12-15 02:21:30

标签: javascript angular typescript

您好我正在尝试将一个对象数组传递给材质对话框。我正是这样做的。

origin destination trips sum_trips trips_div

    1     1101  0.20    2.10    0.0952380952380952
    2     1101  0.30    2.10    0.1428571428571429
    3     1101  0.40    2.10    0.1904761904761905
    1101    1   0.20    1.50    0.1333333333333333
    1101    2   0.30    1.50    0.2000000000000000
    1101    3   0.40    1.50    0.2666666666666666
    1101  1211  0.60    1.50    0.4000000000000000
    1211  1101  0.50    0.50    1.0000000000000000

在组件类中有以下相关的

Model
export interface IPoducts{
     recordname: string;
     comments: [{
         comment: string
      }]
}

对话框组件。

        constructor(public dialog: MdDialog, private productService: ProductService){}
        prod: IProducts[]=[]
        ngOnInit(): void{  
    //service getting data from database       

this.productService.getProcessnotes().subscribe(producsts=>this.products=products,error=>this.errorMessage=<any>error);

         //opening dialgue
        openDialog(prod:any): void {
            let dialogRef = this.dialog.open(prodDialog, {
              width: '400px',
              height: '500px;',
            data: this.prod  <------------------passing the object array
              }); 
          }}

对话框是

 @Component({
      selector: proddialog',
      templateUrl: 'dialogdetails.html',
    })
     export class ProdDialog implements OnInit{
           public pnote: IProducts[];
          constructor(
            public dialogRef: MdDialogRef<DialogOverviewExampleDialog>,
        @Inject(MD_DIALOG_DATA) public  data: {pnote:this.prod }) { }
         public pnote: products;
          onNoClick(): void {
            this.dialogRef.close();
          }
           public ngOnInit():void{
               this.pnote=this.data.prod;

           }

In main template button triggers the dialog box by passing a pnote from *ngFor="let pnote of products"

 <button md-raised-button (click)="openDialog(pnote)">Open Dialog</button>

当我运行此对话框时弹出,但数据只是看到银行。诺数据。你能告诉我如何在对话框中传递对象数组。我的解决方案基于其他解决方案,但没有运气。

注意:一切正常,除了没有传递对象数组外没有错误。

1 个答案:

答案 0 :(得分:0)

您无法设置this.prod的值,因此它没有值。因此,您需要在prod中传递openDialog,或者将方法中的参数分配给this.prod

openDialog(prod:any): void {
  this.prod = prod; // here!!
  let dialogRef = this.dialog.open(prodDialog, {
    width: '400px',
    height: '500px;',
    data: this.prod  // now 'this.prod' will have values!
  }); 
}