https://krzysztofsaja.github.io/angular-weather-widget/
Weather Widget based on Open Weather Map Api
Install through npm:
npm install --save angular-weather-widget
Then include in your apps module:
import { Component , NgModule } from ' @angular/core ' ;
import { AngularWeatherWidgetModule , WeatherApiName } from ' angular-weather-widget ' ;
@ NgModule ( {
imports : [
AngularWeatherWidgetModule . forRoot ( {
key : OPEN_WEATHER_MAP_API_KEY ,
name : WeatherApiName . OPEN_WEATHER_MAP ,
baseUrl : ' http://api.openweathermap.org/data/2.5 '
} )
]
} )
export class MyModule { }
Use in one of your apps components:
import { Component } from ' @angular/core ' ;
import { WeatherSettings , TemperatureScale , ForecastMode , WeatherLayout } from ' angular-weather-widget ' ;
@ Component ( {
template : ' <weather-widget [settings]="settings"></weather-widget> '
} )
export class MyComponent {
settings : WeatherSettings = {
location : {
cityName : ' Szczecin '
} ,
backgroundColor : ' #347c57 ' ,
color : ' #ffffff ' ,
width : ' 300px ' ,
height : ' auto ' ,
showWind : false ,
scale : TemperatureScale . CELCIUS ,
forecastMode : ForecastMode . DETAILED ,
showDetails : false ,
showForecast : true ,
layout : WeatherLayout . WIDE ,
language : ' en '
} ;
}
If you set proper OPEN_WEATHER_MAP_API_KEY key, data will be retrived from Open Weather Map Api. However, you can also pass relevant information from parent component, eg.
import { Component } from ' @angular/core ' ;
import { WeatherSettings , TemperatureScale , ForecastMode } from ' angular-weather-widget ' ;
@ Component ( {
template : ' <weather-widget [currentWeather]=currentWeather [forecast]=forecast [settings]="settings"></weather-widget> '
} )
export class MyComponent {
currentWeather : CurrentWeather = CURRENT_WATHER_MOCK ;
forecast : Forecast [ ] = FORECAST_MOCK ;
settings : WeatherSettings = {
location : {
cityName : ' Szczecin '
}
} ;
}
You may also find it useful to view the demo source .
You may also find it useful to view the demo source .
<script src="node_modules/angular-weather-widget/bundles/angular-weather-widget.umd.js"></script>
<script>
// everything is exported angularWeatherWidget namespace
</script>
All documentation is auto-generated from the source via compodoc and can be viewed here:
https://krzysztofsaja.github.io/angular-weather-widget/docs/
Install Node.js and yarn
Install local dev dependencies: yarn while current directory is this repo
Run yarn start to start a development server on port 8000 with auto reload + tests.
Run yarn test to run tests once or yarn run test:watch to continually run tests.
Bump the version in package.json (once the module hits 1.0 this will become automatic)
MIT
