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
Conteúdo
content
Título que será exibido acima do componente.
valor
ng-model
Propriedade AngularJS 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.
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.
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
Define o número mínimo de caracteres aceito no campo. A linha do campo ficará em vermelho até que o usuário digite o mínimo de caracteres necessários.
Algumas máscaras possuem caracteres que ocupam espaços, dessa forma, ao informar o número mínimo 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.
Somente leitura
ng-readonly
Bloqueia edições no campo e exibe seu conteúdo apenas para leitura.
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.
Dica
Consulte o tópico "Acesso aos subcomponentes" da documentação Componentes visuaispara mais informações.
Figura 2 - Desagrupar componente para acessar subcomponentes