Angular 7 Material 對話框配置數據注入名稱沖突

Question

我試圖在打開材質對話框面板時傳遞一些數據。 下面的例子是我從這里學到的

與 Dialog 組件共享數據。

如果要與對話框共享數據，可以使用數據選項將信息傳遞給對話框組件。

let dialogRef = dialog.open(YourDialog, {
  data: { name: 'austin' },
});

要訪問對話框組件中的數據，您必須使用 MAT_DIALOG_DATA 注入令牌：

import {Component, Inject} from '@angular/core';
import {MAT_DIALOG_DATA} from '@angular/material';

@Component({
  selector: 'your-dialog',
  template: 'passed in {{ data.name }}',
})
export class YourDialog {
  data: any[] = []; // existing code, conflict
  constructor(@Inject(MAT_DIALOG_DATA) public data: any) { }
}

現在問題出在dialog組件中，已經有一個變量data定義和使用了。 並且作為配置傳遞到對話框中的變量名稱data是由 Angular Material Dialog 指定的。 所以它會導致命名沖突。 我可以將現有的data變量更改為其他變量以讓位於 Angular 注入的data ，但是有沒有辦法將注入的data更改為其他data ？ 謝謝。

Answer 1

您不必保持相同的變量名稱。

constructor(@Inject(MAT_DIALOG_DATA) public anyOtherNameHereIsOk: any) { }

這樣做的原因是參數已經被@Inject(MAT_DIALOG_DATA)修飾，所以參數的實際名稱並不重要。 根據數據類型及其使用方式（以及您可能習慣的任何其他命名規則），使用最適合的名稱。

Stackblitz ，請參閱類DialogDataExampleDialog