Lets Create a Weather Widget in Angular using Open Weather Map Api
ฝัง
- เผยแพร่เมื่อ 15 ก.ย. 2024
- In this simple example, you can see how we can use the open weather map api to fetch the recent weather data for any city and then use that to create our own weather widget in Angular.
Open Weather Map:
openweathermap...
Github Source:
github.com/Nit...
►►►Like this Video? Please be sure to SUBSCRIBE for more:
www.youtube.co...
----------My Social Links:
🔴 Facebook Page: / code-first-21550750080...
🔴 My Channel: / codefirst
🔴 View Playlists: / codefirst
🔴 My Github: github.com/Nitij
#AngularWeather
I've gone through so many tutorials but this one has been my favorite!! Thank you!!
I realize I'm kinda off topic but do anybody know a good website to stream new series online ?
@Waylon Josiah try Flixzone. Just search on google for it =)
Thank you very much, very clear, very straight forward, many options to extend by own ideas!!
Thank u for a video. It will be interesting to see how get data for several cities
thx man, plz create more angular videos
Awesome conntent, thank you!
Thanks 👍
Hey. This video is very useful to me man. But how to get it in real time . There is default of value for mumbai only?
it's cool video ! thank you !
nice
Thanks
well made
I was having a lot issues checking if it was really day or night with that method, so my solution:
the API returns inside "weather[0].icon" three characteres, something like "02d".
So, if the last character is "d" it is day / "n" for night
so my method was:
this.weatherData.isDay = (this.weatherData.weather[0].icon.split("").includes("d"))
so it will returns direct from the icon if it's day or night by true or false
Nice
instead of this if you use a query parameter units=metrics then all the data comes in standard format hence no need to edit it
Thanks so much! Really cool way to add weather to my current build!
Iam glad you liked it.
Thank You. Very well explained.
How to do temp for different cities can u help me out
You skipped the part of how to show the data 06:57, i ddnt get how to do that
Great tutorial. But i thought you are going to create a widget which will be reused on other 3rd party websites.
Can I make my own widget based on this tutorial and upload it to github for my portfolio?
no commerce
Yeah man sure.
@@CodeRadiance Thanks❤️
This so cool, thank you very much. 👍💖👌 But, in 16:46 why did you put this.WeatherData = {
main: {},
isDay: true,
};
in ngOnInit() function and I tried to comment them and code still works so why did you add them? what is their purpose?
Looks like default initialization but l'll hv to confirm. It's been a while since I created this video.😸
Why is the minimum and maximum temperature always the same as the current temperature?
temp_min and temp_max are optional parameters mean min / max temperature in the city at the current moment just for your reference.
#FinalsSheridanCollege2020
Thats no Widget, thats a full Angular Application.
Then how we can show it in another page??? You juse made a simple page, Not A WIDGET!!!
Exactly what I thought. Widget is something you inject into another html page, not just an angular project.