angular / components

Component infrastructure and Material Design components for Angular
https://material.angular.io
MIT License
24.39k stars 6.76k forks source link

(Dialog) Component-less alert and confirm dialogs #17048

Open iget-master opened 5 years ago

iget-master commented 5 years ago

Feature Description

My proposal is to create one or two methods on the MatDialog provider/controller to allow component-less alert and confirm dialogs, for example:

// Alert dialog
this.dialog.alert({
    title: 'Forbidden',
    message: 'The resource you are trying to access is forbidden.',
    okButton: 'OK'
})

// Confirm dialog
this.dialog.confirm({
    title: 'Server error',
    message: 'The server is currently in maintenance.',
    confirmButton: 'Retry',
    cancelButton: 'Cancel'
})

Alternatively, both alert and confirm could be on a single method:

this.dialog.alert({
    title: 'The title',
    message: 'The message',
    confirmButton: 'OK', // Optional, only for confirm
    dismissButton: 'Dismiss'
}).afterClose().subscribe((result: boolean) => console.log); // True if confirm, false if dismiss.

Use Case

Currently, we have to create a component for every dialog, event the simplest dialog. This is painful and useless in most cases. Other alternatives (what I do) is to create a AlertService that does it for me. But makes no sense maintain it if it could be a simple feature of MatDialog

tayambamwanza commented 5 years ago

I would love to have this feature, it always confused me that we had to do it like that as default, always thought using your own component should be the optional feature not default behavior, anyway they've done great work so far.

angular-robot[bot] commented 2 years ago

Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.

Find more details about Angular's feature request process in our documentation.

tayambamwanza commented 2 years ago

For reference the old angular material had a few standard dialogs plus the ability to create custom dialogs. In the material design site you can also see "standard" dialogs.

https://material.angularjs.org/latest/demo/dialog https://material.io/components/dialogs#usage

I think 3 would be enough: alert, confirm, prompt.

MikaStark commented 2 years ago

Personnally, I think using TemplateRef is simple/powerful enought to anwser this issue (custom css class, positionning, data injection, etc.). And if it's not enought, yo ucan create one or two generic component that will display a message injected to it plus some design options (like you proposed)

tayambamwanza commented 2 years ago

@MikaStark I don't think it's about difficulty but convenience or DX. Most likely a lot of projects will alert, confirm and prompt users. Having to rebuild the same custom modals repeatedly when there can be one implementation based on the material spec is not the best way to go I believe.

Not saying it's an absolute must but would be incredibly helpful and convenient to use standardized dialogs.

Also I linked the 2 projects above which did have this feature. Since this project is trying to make material components easy for angular developers to use, some standard features of the original library would be great to have, this is supported in mdc why not support it in angular too?