Função
O componente Breadcrumbs indica o endereço da página atual dentro de uma hierarquia de navegação. esse componente se baseia na estrutura criada no componente menu dinâmico.
Figura 1 - Componente breadcrumbs em funcionamento.
Propriedades principais
Na tabela abaixo estão descritas as principais propriedades do componente.
Nome | Propriedade | Função |
|---|---|---|
| Ícone principal | breadcrumb-icon | Define qual o ícone será exibido ao lado esquerdo de cada item do breadcrumb. |
| Tipo de captura | type-menu | Define se os itens do breadcrumb serão inseridos através de blocos de programação ou através do menu. |
| Ícone delimitador | crn-delimiter-icon | Indica o ícone utilizado para separar o caminho entre uma página e outra. Esse ícone pode ser uma seta ( > ) ou uma barra ( / ). Obs: Essa mudança só ocorre em tempo de execução. |
| Identificador do menu | id-menu | Identifica todos os id das diretivas do componente Menu Dinâmico. cron-dynamic-menu, é o id do menu padrão que vem na view home, caso seja adicionado outro componente menu dinâmico a propriedade irá identifica-lo também. |
| 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 de selecionados. |
| Skin | crn-skin | Permite selecionar um skin que afetará apenas o componente selecionado. |
| Classes CSS | class | Adiciona classes CSS que já foram criadas. |
Exemplo
No exemplo da figura 1.1, adicionamos três páginas ao menu ADMIN. Acessando a página Carros, é possível ver no componente breadcrumbs e o caminho necessário para acessar essa página. Um caminho similar será exibido ao selecionar a página Abastecimentos ou Postos, tendo sempre como origem a página ADMIN.
Figura 1.1 - Componente breadcrumbs em execução.
Nome em inglês
breadcrumbs
Nessa página
Compatibilidade
Formulário web
Equivalente mobile
não possui
Botão do Componente
Imagem no Editor Visual
