ionic havadurumu

  İonic üzerinden il ilceye göre hava durumunu gösteren uygulama yapalım. Bunun için il ilce listelerine ihtiyacımız var. buradaki yazıdan yararlanarak il ve ilceleri listeleyin.


adres.html sayfasındaki ilce kısmında ufak değişiklik yapacağız:


 <div ng-show="gethavadurum()">
 <ion-item>
<select ng-model="$root.select_ilce" ng-change="getdistrict()">
   <option ng-repeat="town in $root.ilce "  title="{{town.ilce_ad}}"  value= "{{town.ilce_ad}}" >{{town.ilce_ad}} </option>
</select>
 </ion-item>
</div>

controller.js

 Aynı kontroller üzerinden devam edelim

 $scope.gethavadurum=function(){
     var latin_il=$scope.getturkish($scope.$root.select_ilce);
      $scope.$root.havapng="http://www.mgm.gov.tr/sunum/tahmin-show-2.aspx?m="+latin_il+"&basla=1&bitir=5&rC=111&rZ=fff";
   }

   $scope.getturkish=function(string_text)
   {
    string_text=string_text.toLowerCase();
    string_text=string_text.replace('ö','o');
    string_text=string_text.replace('ü','u');
    string_text=string_text.replace('i','ı');
    string_text=string_text.replace('ç','c');
    string_text=string_text.replace('ğ','g');
    string_text=string_text.replace('ş','s');
   string_text=string_text.toUpperCase();
    return string_text;
   }

Kullandığımız web il yada ilce adlarını parametre olarak alıyor. ve turkçe karakter kabul etmiyor. ek olrak verdiğiniz parametre buyuk harf olmalı. bu nedenle getturkish adlı fonksiyon yazarak ilce adlarini istenilen formata cevirdik.


adress.html sayfasında img nesnesinde hava durumunu gösterelim:

 <div ng-show="isselectilce()">
 <ion-item>
   <img src="{{$root.havapng}}" style="width:400px; height:100px;"/>
 </ion-item>
</div>


çalıştırıp bakalım: