O componente Slider é usado para obter do usuário um valor dentre uma sequência de valores finitos. Muito utilizado quando se quer receber o feedback do usuário sobre o nível de satisfação de um produto ou serviço.
Figura 1 - Exemplo de imagem rodando no Browser
Principais propriedades
Na tabela abaixo estão descritas as principais propriedades do componente.
Nome
Propriedade
Função
Configuração
options
Abre a janela de configurações do slider.
Título
content
Define um rótulo.
Valor
ng-model
Propriedade Angular que pode ser usada para obter e alimentar o conteúdo pelo bloco de programação.
Requerido
ng-required
Define que o campo é de preenchimento obrigatório.
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 da forma inline.
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
Propriedade do Cronapp que trata as permissões de segurança da aplicação. Usado para permitir ou não edição e visualização do componente com base nos perfis selecionados.
Skin
crn-skin
Permite selecionar um skin que afetará apenas o componente selecionado.
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 Slider.
Nome em português
Nome em inglês
Descrição
Seta Esquerda
Arrow Left
Estiliza a seta esquerda do componente.
Seta Direita
Arrow Right
Estiliza a seta direita do componente.
Caminho
Track
Estiliza o caminho do componente.
Botão Arrastar
Drag Button
Estiliza botão arrastar do componente.
Título
Title
Estiliza o título do componente.
Configuração
A propriedade configuração abre a janela de personalização do componente, como definir os valores máximo e mínimo, os valores que são mostrados na barra e etc.
Figura 2 - Janela de configuração do slider
Título botão aumentar: texto exibido no tooltip do botão de incremento - internacionalize o texto clicando no ícone ao lado;
Título botão decrementar: texto exibido no tooltip do botão de decremento. - internacionalize o texto clicando no ícone ao lado;
Título alça de arraste: texto exibido no tooltip do botão de arrasto - internacionalize o texto clicando no ícone ao lado;
Valor mínimo: menor valor para a barra;
Valor máximo: maior valor para a barra;
Valor passo menor: define a quantidade de valores que serão pulados a cada arrasto - por exemplo, se colocar 2, o botão de arrasto nunca ficará em cima de números pares;
Valor passo maior: define a quantidade de valores que serão pulados na enumeração - por exemplo, se colocar 2, só serão enumerados os valores ímpares.