ionic Uzaktan Json Veri Çekme

Mobil uygulamalarda genellikle veritabanı yerine json kullanılır, bunun için ionic’te json kullanmak için ilk olarak ionic’te projemizi oluşturmamız gerekli daha sonra projemizi oluşturduğumuz klasörün içindeki index.html’ye aşağıdaki kodları eklememiz gerekli.

<div ng-controller="kodist">
 <ion-item ng-repeat="i in item">
  <td>{{i.plaka}}</td>
  <td>{{i.sehir}}</td>
 </ion-item>
</div>

Javascript kodlarınızı ise ister index.html’de “<script>” tagları arasına eklersiniz isterseniz de ayrı bir javascript dosyasına ekleyebilirsiniz.

var app = angular.module('starter', ['ionic']);
app.controller('kodist', function ($scope, $http){
$http.get('kodist.json').success(function(data){
 $scope.item = data;
});
});

buradaki “kodist.json” yazan kısım sizin çekecek olduğunuz json dosyanızın adresidir, örnek json dosyamız bu şekildedir:

[
 {
  "plaka": "01",
  "sehir": "Adana"
 },
 {
  "plaka": "02",
  "sehir": "Adıyaman"
 },
 {
  "plaka": "03",
  "sehir": "Afyon"
 },
 {
  "plaka": "04",
 "sehir": "Ağrı"
 },
 {
  "plaka": "05",
  "sehir": "Amasya"
 }
]

NOT: Uygulamamızı denemek için cmd ekranına

ionic serve -l

yazarak uygulamanızın mobilde nasıl görüneceğine bakabilirsiniz.

NOT: Projenizi ionic ile geliştirmiyorsanız aşağıdaki script kodumunuzu head tagları arasına eklemelisiniz.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>