我正在实现material2的对话组件,并面临以下问题:

我想为所有确认类型的消息创建一个通用对话框,开发者可以根据业务需求在对话框中输入文本.但根据docs条规定,没有此类规定.我们是否有解决方案,或者我应该将其作为功能请求发布到github上?

export class ConfirmationDialogComponent implements OnInit {
  @Input() confirmationText: string;
  @Input() confirmationTitle: string;
  @Input() confirmationActions: [string, string][] = [];

  constructor(public dialogRef: MdDialogRef<ConfirmationDialogComponent>) {}

  ngOnInit() {}
}

像这样打电话:

let dialogRef = this.dialog.open(ConfirmationDialogComponent);

推荐答案

open将为您提供组件实例,这意味着您可以按如下方式注入所需的内容:

openDialog() {
    let dialogRef = this.dialog.open(DialogOverviewExampleDialog);
    let instance = dialogRef.componentInstance;
    instance.text = "This text can be used inside DialogOverviewExampleDialog template ";
    console.log('dialogRef',dialogRef);
  }

显然,在DialogOverviewExampleDialog模板中,您可以执行以下操作:

   this is the text {{text }}

Plunker

我通常会做的是,我会创建一个我的组件能够理解的配置对象,然后在打开模式时传递:

 private config = {
    title :"Hello there ",
    text :"What else ? "
 };

 openDialog() {
    let dialogRef = this.dialog.open(DialogOverviewExampleDialog);
    let instance = dialogRef.componentInstance;
    instance.config = this.config;
    console.log('dialogRef',dialogRef);
  }

然后在模态组件内部:

<div class="my-modal">
   <h1>{{config.title}}</h1>
   <p>{{config.text}}</p>
</div>

Typescript相关问答推荐

如何获取嵌套对象属性的正确类型?

如何声明循环数组类型?

TypScript ' NoInfer '类型未按预期工作

如果在TypeScript中一个原始的类方法是递归的,如何使用类decorator 模式?

在Typescribe中,extends工作,但当指定派生给super时出错""

如何在TypeScrip中使用嵌套对象中的类型映射?

为什么我的条件类型不能像我预期的那样工作?

如何在Type脚本中动态扩展函数的参数类型?

TS如何不立即将表达式转换为完全不可变?

CDK从可选的Lambda角色属性承担角色/复合主体中没有非空断言

推断从其他类型派生的类型

布局组件中的Angular 17命名路由出口

使用条件类型的类型保护

Typescript 类型守卫一个类泛型?

根据类型脚本中的泛型属性 Select 类型

我可以使用typeof来强制执行某些字符串吗

react 路由不响应参数

类型';只读<;部分<;字符串|记录<;字符串、字符串|未定义&>';上不存在TS 2339错误属性.属性&q;x&q;不存在字符串

两个接口的TypeScript并集,其中一个是可选的

Typescript 从泛型推断类型