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 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.
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.