Типизированный .js не работает, когда значение объекта передается в разделе строк, и я также использую функцию async / await. - PullRequest
Новая
       9

Типизированный .js не работает, когда значение объекта передается в разделе строк, и я также использую функцию async / await.

0 голосов
/ 04 января 2019

Я пытаюсь добавить эффект ввода к данным, поступающим из API, и показать их в li файле ejs. Я использую CDN typed.js, и я также использую функцию асинхронного вызова в своем приложении .js, вот мой код.

app.js 

window.onload = function () {
  // if (localStorage.getItem("hasCodeRunBefore") === null) {
  async function positionFind(position){
    //lat and long value passed in the weather function
    await weather(position.coords.latitude,position.coords.longitude)
  }
  //check if browswer support geolocation
  if(navigator.geolocation){
    navigator.geolocation.getCurrentPosition(positionFind)
  }
}
let info={}
async function weather(lat,lon){
  // API call
  let data=await fetch('http://api.openweathermap.org/data/2.5/weather?'+'&lat='+lat+'&lon='+lon+'&units=metric'+'&APPID='+WEATHER_KEY)
  console.log("inside API")
  const res= await data.json();
  console.log(res)
  Object.defineProperties(info, {
    name: {
      value: res.name,
      writable: false
    },
    temp: {
      value: res.main.temp,
      writable: false
    },
    humidity: {
      value: res.main.humidity,
      writable: false
    },
    pressure: {
      value: res.main.pressure,
      writable: false
    },
    description: {
      value: res.weather[0].description,
      writable: false
    }
  })
  temp(info.temp)
  console.log(info.temp)

}
async function temp(value){

  let typed=new Typed('#text', {
    strings:[value],
    typeSpeed: 120,
  });
}

app.ejs 

  <ul>
    <li id="text"></li>
  </ul>

что я ожидаю

Эффект печати на li, при котором будет напечатано значение info.temp.

выход

Без изменений на веб-странице.

Примечание:

Я знаю, что можно записать переменную в string секции typed.js, когда я пытаюсь реализовать это в другом файле, который работает.

...