taiga-family / taiga-ui

Angular UI Kit and components library for awesome people
https://taiga-ui.dev
Apache License 2.0
3.31k stars 467 forks source link

šŸš€ - Dialog with components change title before opening #9830

Closed gboutte closed 3 days ago

gboutte commented 4 days ago

Description

Hello,

I'm new to taiga ui, so if that's something that is already available let me know and I'll close this issue.

Problem

I was using a dialog with a component for a case where I open it multiple time.

The modal is created like this:

  private readonly dialog = tuiDialog(MyComponentComponent, {
    dismissible: true,
    label: 'My title'
  });

And opened like this

this.dialog(data)

I wanted to set the title dynamically. It seems it's not possible when calling this.dialog(data) and it was not possible to create the dialog just before opening it, because it's not during an injection context, so if I am not wrong, this must stay in the properties.

My solution

I copied and pasted a lot of code from the dialog factory file: https://github.com/taiga-family/taiga-ui/blob/main/projects/core/components/dialog/dialog.factory.ts

I created a custom tuiDialog method, insted of returning (data: D) => Observable<R> it return (data: D,title:string) => Observable<R>

Now it's:

  private readonly dialog = this.CustomTuiDialog(MyComponentComponent, {
    dismissible: true,
  });

And opened like this

this.dialog(data,'My title')

Proposition

In my case it works, but that need to paste a lot of code. I think that could be great feature to be able to be able to override the TuiDialogOptions when calling the dialog. That could be a parameter that would be at the same place of my title.

If you want I could ty to create a pull request with the changes. Just let me know.

waterplea commented 4 days ago

You can just inject the injector and run tuiDialog in injection context to call it when you have all the necessary data

gboutte commented 3 days ago

Thanks, I did not thinks to do that. I'll close the issue