Páginas filhas
  • Angular Elements - Criando Componentes Novos e utilizando em Portal antigo

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

  • <nome do componente>.controller.js
  • <nome do componente>.module.js
  • <nome do componente>.route.js
  • <nome do componente>.view.html


5) Definição do arquivo <nome do componente>.controller.js

...

Dentro do arquivo de controller, inclua as linhas de:

  • declaração de definição do controller (linhas 1, 2 e 22)
  • Referência para o módulo correspondente (linhas 4 a 6)
  • Injeção dos módulos compartilhados (linha 8)
  • Constructor em forma de função com método de carregamento do componente e seus respectivos eventos customizáveis (linhas 10 a 21)

Image Added

6) Definição do arquivo <nome do componente>.module.js

...

Dentro do arquivo de módulo, inclua a definição de módulo do angularJS com o nome do módulo do componente

Image Added

7) Definição do arquivo <nome do componente>.route.js

...

Dentro do arquivo de rota, será necessário mapear as rotas configuradas no componente anterior em AngularJS para o novo componente do elements, conforme exemplo:


Image Added

Para cenário do exemplo anterior foi criado um método de mapeamento dentro de um arquivo de mapeamento global da aplicação, conforme segue abaixo: 

Image Added

As rotas originais (do componente a ser substituído pelo novo componente em angular elements) podem ser encontradas no arquivo de configuração de rotas do componente bem como suas dependências de demais módulos e controllers, conforme exemplo:

Image Added


8) Mapeamento do novo componente (elements) no portal migrado

...

Dentro do arquivo de módulos do portal migrado, substitua os arquivos de módulo e rota antigos pelos novos criados para o componente em angular elements, exemplo:

Image Added


*Lembre-se de incluir o subdiretório "/elements" caso tenha usado este padrão no seu projeto