Angular Material底表,尝试将变量作为数据传递时遇到麻烦

时间:2019-11-14 17:01:04

标签: html angular typescript angular-material angular8

尝试将变量作为数据传递到Angular 8材质的底表。 根据他们的文档,我能够成功地将字符串传递到底部表单,但无法传递变量。有人可以帮忙吗?我感谢所有建议。

这是我要打开的底页的TS和HTML

//HTML Portion

<div> passed in {{data.searchResults}}</div>

// TS Portion

import { Component, Inject } from '@angular/core';
import { MatBottomSheetRef, MAT_BOTTOM_SHEET_DATA } from '@angular/material/bottom-sheet';

@Component({
  selector: 'app-singlejobpage',
  templateUrl: './singlejobpage.component.html',
  styleUrls: ['./singlejobpage.component.scss']
})
export class SinglejobpageComponent {

  constructor(@Inject(MAT_BOTTOM_SHEET_DATA) public data: any, private _bottomSheetRef: MatBottomSheetRef<SinglejobpageComponent>) { }

  openLink(event: MouseEvent): void {
    this._bottomSheetRef.dismiss();
    event.preventDefault();
  }


}

下面是我的mainpage.TS,我正在尝试发送数据。

 openBottomSheet(): void {
    this._bottomSheet.open(SinglejobpageComponent, {
      data: { searchResults: this.filteredData }
    });
  }

  filterForone(y) {
    let filteredData = this.jobs.filter(x => x.data.title === y)
    console.log(filteredData)
    console.log(filteredData[0].data.title)
    this.openBottomSheet();
  }

1 个答案:

答案 0 :(得分:0)

您正在引用this.data,但是在您的代码中您从未设置此属性。

尝试:

 openBottomSheet(): void {
    this._bottomSheet.open(SinglejobpageComponent, {
      data: { searchResults: this.filteredData }
    });
  }

  filterForone(y) {
    this.filteredData = this.jobs.filter(x => x.data.title === y)
    console.log(this.filteredData)
    console.log(this.filteredData[0].data.title)
    this.openBottomSheet();
  }