Pergunta sobre o desenvolvimento com WordPress por WordPress: Integração simples de WP e AngularJS

Um usuário perguntou ?

Eu sou relativamente novo no WP e AngularJS. Eu quero fazer algo simples, leve Prova de conteúdo de conceito localmente para ajudar no meu entendimento.

Eu posso fazer o componente angular funcionar independentemente do WP copiando qualquer amostra de aqui e servi-lo diretamente (sem conexão com WP) do meu servidor web Apache local.

Eu quero ser capaz de integrar a mesma instância AngularJS em uma página WP construída.

Suspeito que o carregamento seja devido ao carregamento angular do library.min.js.

Eu tentei várias coisas, todas com o mesmo resultado, ou seja, uma página exibindo conteúdo AngularJS não preparado. Visão captura de tela aqui

Adicionei o código relevante ao bloco HTML do Gutenberg. Eu tentei carregar a biblioteca angular.min.js usando métodos diferentes…

1 Incluindo-o diretamente no bloco Gutenberg (não esperava que funcionasse de qualquer maneira, embora tenha funcionado quando incluído no meu teste, outras páginas foram atendidas diretamente fora do WP).

2 Codificando-o em uma página de modelo de amostra, com e sem registrá-lo primeiro… ou seja, também…

wp_register_script('angularjs', '/wp-content/themes/twentynineteen/angularjs/angular.min.js');
wp_enqueue_script('angularjs');

ou…

wp_enqueue_script( 'angularjs', '/wp-content/themes/twentynineteen/angularjs/angular.min.js');

sa wp_enqueue_script eu verifiquei que angular.min.js acariciado adequadamente. Também experimentei passar o URL da CDN para wp_register_script/wp_enqueue_scriptAlém de usar os dois true e false como valores de função de enfileiramento $in_footer = false argumento.

Obtenho o mesmo resultado em todos os casos. Como mostrado na imagem.

Alguém pode apontar o que posso precisar para fazer isso funcionar? Não quero esconder minha compreensão fazendo algo muito tendencioso. Simplí é uma ideia simples em minha mente. Carregue a biblioteca AngularJS e execute o código.

Obrigado

(@kartik16)

1 ano, 10 meses atrás

Oi Martinforsyth,

Sim, esta é uma ideia relativamente simples e existem muitos links de referência para isso.

Você pode verificar isso?

Eu espero que isso ajude.

Obrigado.

(@martinforsyth)

1 ano, 10 meses atrás

obrigado kartik16

Eu já vi algumas dessas coisas antes. É um pouco mais pesado do que o que está atrás de mim. Estou tentando evitar muito criando uma compilação de tema/plugin para que isso funcione.

De certa forma, estou menos interessado em criar um aplicativo AngularJS funcional e mais interessado em saber por que ele não está funcionando para mim em um caso simples. Definitivamente, há algo que eu não entendo muito bem. Isso é o que eu quero saber.

(@bcworkz)

1 ano, 10 meses atrás

A maneira como você fez parece bom e, como eu diria, a referência na página está correta, assumindo que é isso que você quer dizer com “patch”.

Não é seguro colocar código JS em um bloco HTML, ele será quebrado. Há um bloco de código dedicado que você deve usar para incorporar um script. Para uma grande quantidade de código, é melhor gerenciá-lo como um arquivo externo e listá-lo.

Você não deve adicionar arquivos e pastas à pasta de vinte temas. Crie um tema filho ou plug-in dedicado para conter arquivos adicionais.

Isto foi útil?

0 / 0

Deixe uma resposta 0

O seu endereço de email não será publicado. Campos obrigatórios são marcados *