Modal
Para que o serviço Modal funcione corretamente, é necessário seguir alguns pequenos passos.
#
ComponenteO Modal é dividido em duas estruturas: Serviço e Componente e para que funcione corretamente, ambas devem estar implementadas em seu código.
Começaremos com o com ponente, que é a base para o bom funcionamento: Inclua o a tag abaixo na página que chamará a modal, preencha os atributos e, entre as tags poderá adicionar qualquer conteúdo que deseje. É comum na área do content (entre as tags), includir todas as variações de conteúdo permitidas na tela e via variavel definir qual será exibida ou oculta.
#
Atributos da tagAtributo | Input/Output | Tipo | Obrigatório | Valores padrões |
---|---|---|---|---|
cancelClick | @Output | function | Não | - |
confirmClick | @Output | function | Sim | - |
cancelButtonText | @Input | String | Sim | - |
confirmButtonText | @Input | String | Sim | - |
cancelButtonText e confirmButtonText
Estes atributos devem ser preenchidos com o texto que será exibido nos botões
cancelClick e confirmClick
Os outputs são necessário para informar o que os botões de confirmação e cancelamento devem fazer. Para que a modal seja fechada após clicar neles, chame o método do serviço: close()
.
#
O serviçoApós adicionar a tag contendo os atributos, é hora de implementar o serviço e executar a abertura da modal. A modal oferece 4 métodos de abertura, ambos seguindo um padrão muito semelhantes: