Versões comparadas
Chave
- Esta linha foi adicionada.
- Esta linha foi removida.
- A formatação mudou.
Função
Esse componente adiciona uma caixa de texto que aceita diversas linhas, bastante utilizado quando existe a necessidade de criar um texto longo, como comentário.
Figura 1 - Exemplo do componente rodando no browser
Principais propriedades
Na tabela abaixo estão descritas as principais propriedades para o funcionamento básico do componente.
Nome | Propriedade | Função |
---|
Título | content | Título que será exibido acima do componente. |
Sugestão | placeholder | Exibe um exemplo de resposta para o usuário quando o campo está vazio. |
Quantidade de Linhas | rows | Define a altura do campo de texto por número de linhas, caso o texto ultrapasse esse número, uma barra de rolagens é exibida. |
Máximo de caracteres | maxlength | Define a quantidade máxima de caracteres que o usuário pode inserir. |
Redimensionável | resize | Define se o campo pode ser estendido: somente na vertical, somente na horizontal ou em ambas direções. |
valor | ng-model | Propriedade |
Angular que pode ser usada para obter e alimentar seu conteúdo pelo bloco de programação. | ||
identificador | id | Atributo que especifica um ID exclusivo para o componente. Por padrão um id é gerado automaticamente e atribuído ao componente. |
Estilo | style | Altera o estilo geral do componente. |
Exibir | ng-show | Propriedade Angular usada para mostrar ou oculta o componente. |
Repetir | crn-repeat | Propriedade que seleciona uma fonte de dados contida na tela e repete o componente baseado no número de itens dessa fonte de dados. |
Segurança | cronapp-security | Abre a janela de seleção dos grupos com permissões para visualização ou edição. |
Classes CSS | class | Adiciona classes CSS que já foram criadas. |
Propriedades do subcomponente input
As propriedades abaixo não são nativas do componente. Para adicionar essas ou outras propriedades será necessário selecionar o subcomponente input.
Nome | Propriedade | Função |
---|---|---|
Identificador | id | Atributo que especifica um ID exclusivo para o componente. Por padrão um id é gerado automaticamente e atribuído ao componente. |
Estilo | style | Altera o estilo geral do input. |
Exibir | ng-show | Propriedade Angular usada para mostrar ou oculta o componente. |
Linhas | rows | Define a altura do campo de texto por número de linhas, caso o texto ultrapasse esse número, uma barra de rolagens é exibida. |
Redimensionável | resize | Define se o campo pode ser estendido: somente na vertical, somente na horizontal ou em ambas direções. |
Propriedades do subcomponente input
As propriedades abaixo não são nativas do componente. Para adicionar essas ou outras propriedades será necessário selecionar o subcomponente input.
Repetir | crn-repeat | Propriedade que seleciona uma fonte de dados contida na tela e repete o componente baseado no número de itens dessa fonte de dados. |
Requerido | ng-required | Define que o campo é de preenchimento obrigatório. |
Segurança | cronapp-security | Abre a janela de seleção dos grupos com permissões para visualização ou edição. |
Sugestão | placeholder | Exibe um exemplo de resposta para o usuário quando o campo está vazio. |
Tamanho máximo | maxlength | Define o número máximo de caracteres aceito no campo. |
Nome
Propriedade
Função
Tamanho máximo
maxlength
Define o número máximo de caracteres aceito no campo.
Algumas máscaras possuem caracteres que ocupam espaços, dessa forma, ao informar o número máximo de caracteres nesta propriedade, leve em consideração a quantidade de caracteres utilizados pela máscara.
Ex,: Um CPF possui 11 dígitos, porém mais 3 caracteres são exibidos ao utilizar a máscara CPF (2 "." e 1 "-"). Sendo necessário informar o valor 14 nessa propriedade.
Tamanho mínimo
minlength
Algumas máscaras possuem caracteres que ocupam espaços, dessa forma, ao informar o número |
máximo de caracteres nesta propriedade, leve em consideração a quantidade de caracteres utilizados pela máscara. |
Valor | ng- |
model | Propriedade Angular que pode ser usada para obter e alimentar o conteúdo pelo bloco de programação. | |
Classes CSS | class | Adiciona classes CSS que já foram criadas. |
Aba de Estilos
Na tabela abaixo estão descritos os tipos de estilos disponíveis para o componente Entrada de Texto.
Nome em português | Nome em inglês | Descrição |
---|---|---|
Título | Title | Estiliza o título do componente. |
Entrada de texto | Input | Estiliza a entrada de texto do componente. |
Sugestão | Placeholder | Estiliza a sugestão do componente |
Bloqueia edições no campo e exibe seu conteúdo apenas para leitura. Por padrão, possui as opções "Sim" e "Não".
Essa propriedade também aceita expressões, permitindo por exemplo, bloquear um campo vinculado a um fonte de dados:
datasource.editing
" para bloquear o campo quando a fonte de dados estiver em modo de edição oudatasource
.editing || datasource.inserting
" para bloquear o campo quando a fonte de dados estiver em modo de edição ou inserção. |
Âncora | ||||
---|---|---|---|---|
|
Subcomponentes
O componente Área de texto é formado por dois subcomponentes agrupados: label, input. Ao clicar no botão bolha com ícone de cadeado (Figura 2) o componente é desbloqueado, permitindo a seleção de seus subcomponentes.
Informações | ||
---|---|---|
| ||
Consulte o tópico "Acesso aos subcomponentes" da documentação Componentes visuais para mais informações. |
Image Removed
Image Added
Figura 2 - Desagrupar componente para acessar subcomponentes
Nome em inglês
Textarea
Nessa página
Índice | ||||
---|---|---|---|---|
|
Compatibilidade
Formulário web
Equivalente mobile
Botão do Componente
Image Added
Imagem no Editor Visual
Image Added