角度材质:将数据从一个零部件传递到另一个零部件

Question

我有两个组件，第一个组件ShowDepComponent有ngFor来收集DapatmentName和DepartmentID。当触发点击事件时，我想将这些DepartmentName传递给另一个组件AddEditDepComponent，DepartmentName应该传递给另个组件AddEditDepComponent。

如何做到这一点？谢谢

ShowDepComponent:

• HTML

<ng-container *ngFor="let eachone of GetDepartList">
<mat-grid-tile [style.background]="'#F1EBBA'">
{{eachone.DepartmentId}}
</mat-grid-tile>
<mat-grid-tile [(ngModel)]="DepartmentName" [style.background]="'#F1EBBA'">
{{eachone.DepartmentName}}
</mat-grid-tile>
<mat-grid-tile  [style.background]="'#F1EBBA'">
<button  (click) = "EditDeprt()" class="Options" mat-stroked-button> Edit</button>
<button (click) = "DelDeprt()" mat-stroked-button> Delete </button> 

• .ts文件：

DepartmentName: any;
Department: any;
EditDeprt() {
this.Dialog.open(AddEditDepComponent, {
height: '200px',
width: '400px',
data: {DepartmentName: this.DepartmentName} 
});

Answer 1

到目前为止所做的是正确的，剩下的就是在AddEditDepComponent中获取Department名称。

因此，在AddEditDepComponent中，您可以将从ShowDepComponent发送的数据注入其构造函数。您已经使用dialog.open()方法发送了数据。

你所要做的就是在AddEditDepComponent中获取数据。ts:

constructor(
@Inject(MAT_DIALOG_DATA) public data: any,
){}
ngOnInit(): void {
console.log(this.data.DepartmentName);
}