AngularJS获取天气预报(案例)

忘是亡心i 2022-07-12 08:13 318阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>天气预报</title>
    </head>
    <body ng-app="Weather">
    	
    	<div ng-controller="WeatherController">
    		<table>
    			<tr ng-repeat="weather in weatherData">
    				<td>{
       {weather.date}}</td>
    				<td>{
       {weather.temperature}}</td>
    				<td>{
       {weather.weather}}</td>
    				<td>{
       {weather.wind}}</td>
    				<td><img ng-src="{
       {weather.dayPictureUrl}}" alt=""></td>
    				<td><img ng-src="{
       {weather.nightPictureUrl}}" alt=""></td>
    			</tr>
    		</table>
    	</div>
    
    	<script src="./libs/angular.min.js"></script>
    	<script>
    			
    		var Weather = angular.module('Weather', []);
    
    		Weather.controller('WeatherController', ['$scope', '$http', function ($scope, $http) {
    
    			$http({
    				url: 'http://api.map.baidu.com/telematics/v3/weather',
    				method: 'jsonp',
    				params: {
    					location: '北京',
    					output: 'json',
    					ak: '0A5bc3c4fb543c8f9bc54b77bc155724',//这两个ak用不了了需要自己取下载
    					callback: 'JSON_CALLBACK'
    				}
    			}).success(function (info) {
    
    				// console.log(info);
    
    				$scope.weatherData = info.results[0].weather_data;
    
    			});
    					
    
    		}]);
    
    	</script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，318人围观）

还没有评论，来说两句吧...

相关阅读

相关 [网络爬虫]天气预报案例

爬取全国各地区的天气情况,调用的API接口API:http://t.weather.sojson.com/api/weather/city/

一时失言乱红尘/ 2024年04月24日 20:34/ 0 赞/ 52 阅读

相关 vue天气预报

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

你的名字/ 2022年12月07日 15:09/ 0 赞/ 256 阅读

相关 java程序获取天气预报_java调用中国天气网api获得天气预报信息的方法

本文实例讲述了java调用中国天气网api获得天气预报信息的方法。分享给大家供大家参考。具体实现方法如下： //以冰城哈尔滨为例通过中国天气api调用天气信息 privat

快来打我*/ 2022年11月04日 00:56/ 0 赞/ 348 阅读

相关 axios获取天气预报

大家好！我是星河，今天给大家带来的是获取接口实现一个天气的情况 > 天气接口:http://wthrcdn.etouch.cn/weather\_mini 这个是我写的

矫情吗；*/ 2022年09月06日 01:34/ 0 赞/ 324 阅读

相关 domino获取天气预报

在一般的首页上有些企业喜欢显示天气，哪天气怎样在domino上显示呢？ 1)如果纯从html考虑的话，可以使用js或jquery插件就可以了,如以下的插件 htt

蔚落/ 2022年08月07日 04:57/ 0 赞/ 265 阅读

相关 Android 天气预报

从开始到完成基本功能差不多一个星期因为不知道怎么入手和很多导包的问题在这个项目里我第一次用了线程网络请求 json解析所以觉得还是挺有意义的我在写的时候没

绝地灬酷狼/ 2022年07月28日 04:06/ 0 赞/ 288 阅读

相关 Qt 天气预报

weather 天气软件，基于Qt、天气信息是通过api获取. 环境：windows8.1 Qt5.7 　　　mac Qt5.7 源码：[https://gith

阳光穿透心脏的1/2处/ 2022年07月17日 03:10/ 0 赞/ 412 阅读

相关 AngularJS获取天气预报(案例)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti

忘是亡心i/ 2022年07月12日 08:13/ 0 赞/ 319 阅读

相关简单天气预报

实现效果图 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9n

Dear 丶/ 2022年02月04日 10:13/ 0 赞/ 378 阅读

相关 C#获取中国天气网免费天气预报信息

中国天气网接口地址：”http://wthrcdn.etouch.cn/WeatherApi?citykey=” + weatherCityCode（为城市code）; ![

古城微笑少年丶/ 2021年12月24日 14:09/ 0 赞/ 559 阅读