将参数传递给 mat-dialog open 方法
Posted
技术标签:
【中文标题】将参数传递给 mat-dialog open 方法【英文标题】:passing parameter to mat-dialog open method 【发布时间】:2019-07-23 04:11:43 【问题描述】:Angular 7.1 , AngularMaterial 7.3
我正在尝试调用函数并传递一些值,它提示以下错误
未找到 t1 的组件工厂。你把它添加到@NgModule.entryComponents 了吗?
虽然t1
包含在entryComponent
中。但是一旦删除传递值以修复值,它将起作用。
<button mat-button (click)="openDialog('t1')">T1</button>
<button mat-button (click)="openDialog('t2')">T2</button>
一旦我传递了值,它就会显示上面的代码。
openDialog(e)
console.log(e);
const dialogRef = this.dialog.open(e);
dialogRef.afterClosed().subscribe(result =>
console.log(`Dialog result: $result`);
dialogRef == null
);
@Component(
selector: 't1',
templateUrl: 't1.html',
)
export class t1
@Component(
selector: 't2',
templateUrl: 't2.html',
)
export class t2
但一旦我删除该值并修复 dialogRef.open
,它就可以正常工作
const dialogRef = this.dialog.open(t1);
【问题讨论】:
如果t1
是您的组件,请将其添加到 appModule 或 entryComponents: []
数组中的支持模块文件中
@Abhishek, t1,t2
已添加到 AppModule 中
是否可以分享appModule?
【参考方案1】:
您应该发送一个变量而不是字符串。它应该是 t1
而不是 't1'
<button mat-button (click)="openDialog(t1)">T1</button>
<button mat-button (click)="openDialog(t2)">T2</button>
在你的component.ts中,你应该声明组件
public t1 = new t1();
public t2 = new t2();
或者您可以使用template variables
尝试以下方法
<t1 #test1></t1>
<t2 #test2></t2>
<button mat-button (click)="openDialog(test1)">T1</button>
<button mat-button (click)="openDialog(test2)">T2</button>
【讨论】:
你的 component.ts 中有没有 t1 的实例 我已经更新了我的答案,您应该在属性中引用您的组件类名称 在声明 t1,t2 后,出现此错误No component factory found for [object Object]. Did you add it to @NgModule.entryComponents?
你可以试试我建议的另一种方法
让我们continue this discussion in chat.【参考方案2】:
试试这样的
constructor(
public dialogRef: MatDialogRef<Component>,
private dialog: MatDialog,
)
openDialog(t1)
const dialogRef = this.dialog.open(NameComponent,
data: t1
);
dialogRef.afterClosed().subscribe(data =>
在对话框组件中检索时
@Inject(MAT_DIALOG_DATA) public data: any,
希望有效果
【讨论】:
【参考方案3】:openDialog(dialog : string)
if(dialog == "t1")
const dialogRef = this.dialog.open(t1, data: "YOURVALUE" );
dialogRef.afterClosed().subscribe(result => this.YOURVALUE = result; );
else
const dialogRef = this.dialog.open(t2, data: "YOURVALUE" );
dialogRef.afterClosed().subscribe(result => this.YOURVALUE = result; );
【讨论】:
我虽然关于这个,但如果增加更多按钮,那么就像这样<button mat-button (click)="openDialog('t1')">T1</button> <button mat-button (click)="openDialog('t2')">T2</button> <button mat-button (click)="openDialog('t3')">T3</button> <button mat-button (click)="openDialog('t4')">T4</button>
【参考方案4】:
这对我有用。你也可以参考这个链接。 link
您可以使用dialogRef.componentInstance.myProperty = 'some data'
设置组件上的数据。
你可能需要这样的东西:
let dialogRef = this.dialog.open(DialogComponent, disableClose: true, ); dialogRef.componentInstance.name = 'Sunil';
然后在你的 DialogComponent 中你需要添加你的 name 属性:
public name: string;
【讨论】:
以上是关于将参数传递给 mat-dialog open 方法的主要内容,如果未能解决你的问题,请参考以下文章
将参数传递给从 R 中的字符串调用的用户定义函数的最佳方法是啥?