[英]Error using Ionic framework for weather app
我正在使用离子构建天气应用程序,并且差不多完成了。 我的风向轴承有问题,在json数据中,我们只有风向度,我必须使用此代码,但当前未显示。
$scope.windBearing = function(windBearing) {
if (windBearing < 11.25 && windBearing > 348.75)
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/n.png"style="width: 60px;"><h4 class="text-center">الرياح شمالية</h4>';
else if (windBearing > 11.25 && windBearing < 33.75) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/nne.png"style="width: 60px;"><h4 class="text-center">الرياح شمالية شمالية شرقية</h4>';
} else if (windBearing > 33.75 && windBearing < 56.25) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/ne.png"style="width: 60px;"><h4 class="text-center">الرياح شمالية شرقية</h4>';
} else if (windBearing > 56.25 && windBearing < 78.75) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/ene.png"style="width: 60px;"><h4 class="text-center">الرياح شرقية شمالية شرقية</h4>';
} else if (windBearing > 78.75 && windBearing < 101.25) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/e.png"style="width: 60px;"><h4 class="text-center">الرياح شرقية</h4>';
} else if (windBearing > 101.25 && windBearing < 123.75) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/ese.png"style="width: 60px;"><h4 class="text-center">الرياح شرقية جنوبية شرقية</h4>';
} else if (windBearing > 123.75 && windBearing < 146.25) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/se.png"style="width: 60px;"><h4 class="text-center">الرياح جنوبية شرقية</h4>';
} else if (windBearing > 146.25 && windBearing < 191.25) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/s.png"style="width: 60px;"><h4 class="text-center">الرياح جنوبية</h4>';
} else if (windBearing > 191.25 && windBearing < 213.75) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/ssw.png"style="width: 60px;"><h4 class="text-center">الرياح جنوبية جنوبية غربية</h4>';
} else if (windBearing > 213.75 && windBearing < 236.25) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/sw.png"style="width: 60px;"><h4 class="text-center">الرياح جنوبية غربية</h4>';
} else if (windBearing > 236.25 && windBearing < 258.75) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/wsw.png"style="width: 60px;"><h4 class="text-center">الرياح غربية جنوبية غربية</h4>';
} else if (windBearing > 258.75 && windBearing < 281.25) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/w.png"style="width: 60px;"><h4 class="text-center">الرياح غربية</h4>';
} else if (windBearing > 281.25 && windBearing < 303.75) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/wnw.png"style="width: 60px;"><h4 class="text-center">الرياح غربية شمالية غربية </h4>';
} else if (windBearing > 303.75 && windBearing < 326.25) {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/nw.png"style="width: 60px;"><h4 class="text-center">الرياح شمالية غربية</h4>';
} else {
return '<img alt="" class="center-block" src="http://meteoiraq.com/img/nnw.png"style="width: 60px;"><h4 class="text-center">الرياح شمالية شمالية غربية</h4>';
}
}
代码html
<div>{{windBearing(weatherInfo.currently.windBearing)}}<div>
使用{{text}}语法进行绑定将插入文本,而不是按@ misha130所说的那样编译HTML,因此您会看到标记,而不是预期的图像。
您需要使用ng-bind-html进行绑定。 因此,将上面的div替换为以下内容:
<div ng-bind-html="windBearing(weatherInfo.currently.windBearing)"></div>
如果收到$ sce:unsafe错误,则意味着您需要先清理HTML。 为此,请包括一个用于进行角度消毒的脚本并将ngSanitize注入模块中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.