0

Estou utilizando a view engine handlebars, porém, quando fui manipular elementos DOM, ele continua com o valor dado a ele pelo escape, segue o código abaixo:

página monitor.handlebars:

<script src="/monitoramento.js"></script>
{{#each result}}
<div class="container mt-5">
    <h6>Bomba 1: <small id="bomba1">{{bomba}}</small></h6>
    <hr>
    <h6>Bomba 2: <small id="bomba2">texto aqui</small></h6>
    <hr>
    <h6>Caixa D'Água: <small id="caixa">texto aqui</small></h6>
    <hr>
    <h6>Cisterna: <small id="cisterna">texto aqui</small></h6>
    <hr>
    <h6>Temperatura: <small id="temperatura">texto aqui</small></h6>
    <hr>
    <h6>Pressão: <small id="pressao">texto aqui</small></h6>
    <hr>
    <h6>Data: <small id="data">texto aqui</small></h6>
    <hr>
</div>
{{else}}
    <h1>Não foram encontrados registros!</h1>
{{/each}}

Pequeno script monitoramento.js para manipular elementos do DOM:

var bomba1 = document.querySelector('#bomba1')

if (bomba1.value = 1) {
    bomba1.innerHTML = 'Bomba ligada'
}

porquê não funciona?

OBS: No arquivo da raiz do projeto eu coloquei o caminho para os conteúdos estáticos.

12
  • 1
    No if vc está usando um operador errado em bomba1.value = 1, quando deveria ser == ou ===. Veja neste tópico a diferença entre eles.
    – Sam
    11/02/2020 às 13:30
  • Seu if está atribuindo '1' ao invés de comparar se value é igual a '1'. Utilize o operador '==' ou então o operador igual estrito '==='. 11/02/2020 às 13:31
  • caraca nem percebi esse erro que fiz vou implementar aqui e já dou a resposta...
    – Teuuz1994
    11/02/2020 às 13:32
  • Eu tentei implementar aqui, porém continua dando o mesmo resultado, ele não substitui o elemento :/
    – Teuuz1994
    11/02/2020 às 13:34
  • Olha no console possíveis erros.
    – Sam
    11/02/2020 às 13:35

1 Resposta 1

1

Aparentemente, o que está impedindo o seu código de funcionar é porque você não está utilizando o método compile do Handlebars. Então a solução é simples:

Primeiramente, procure trazer seus arquivos de <script> sempre ao final do corpo do seu HTML. Depois, o que eu fiz foi atribuir a uma variável template o método compile da biblioteca, como é informado na documentação:

var template = Handlebars.compile("{{result}}");

Então o seu código ficaria assim:

    var template = Handlebars.compile("{{result}}");

    var bomba1 = document.querySelector('#bomba1')

    if (bomba1.value = 1) {
        bomba1.innerHTML = "Bomba ligada";
    }

Se quiser mais informações, dá uma olhadinha na documentação da biblioteca Handlebars: https://handlebarsjs.com/guide/#what-is-handlebars

Espero ter ajudado, abraços!

4
  • ok vou implementar aqui e já falo a resposta, mesmo assim valeu mesmo amigo
    – Teuuz1994
    11/02/2020 às 14:05
  • fiz de tudo mas aqui não funcionou, e não sei o porque no meu console do navegador aparece que esse Handlebars não foi definido: Uncaught ReferenceError: Handlebars is not defined
    – Teuuz1994
    11/02/2020 às 14:37
  • consegui! valeu a todos que puderam tirar um pouco do seu tempo para me ajudar funcionou aqui não estava funcionando porque eu tinha esquecido de importar o handlebars para o corpo da página com um script
    – Teuuz1994
    11/02/2020 às 14:42
  • Isso ai! Se tiver mais alguma dúvida, só chamar :D 11/02/2020 às 14:47

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .