So here I go with my first question. I am trying to use ng-repeat to render data from the server, but it's not displaying anything. this is the code for my controller
.controller('ExampleController', function($scope, $http) {
var url = "https://lari.jumpstart.ge/en/api/v1/commercial_banks?callback=JSON_CALLBACK";
$http.jsonp(url)
.success(function(data) {
$scope.results = data.results;
})
.error(function(data) {
alert("ERROR");
});
});
this is the ng-repeat in my view
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Ionic Blank Starter</h1>
</ion-header-bar>
<ion-content >
<ion-item ng-controller='ExampleController' ng-repeat='x in results'>
{{x.code}}
</ion-item>
</ion-content>
</ion-pane>
</body>
</html>
this is the array on the server
{
"valid":true,
"results":[
{
"code":"BAGA",
"name":"Bank Of Georgia",
"currencies":[
"AED",
"AMD",
"AUD",
]
},
{
"code":"TBCB",
"name":"TBC Bank",
"currencies":[
"AED",
"AUD",
"AZN",
]
},
The erroneous code has the ng-controller
directive on the same node as the ng-repeat
directive.
<!-- Replace THIS
<ion-content >
<ion-item ng-controller='ExampleController' ng-repeat='x in results'>
{{x.code}}
</ion-item>
</ion-content>
-->
<!-- With THIS -->
<ion-content ng-controller='ExampleController' >
<ion-item ng-repeat='x in results'>
{{x.code}}
</ion-item>
</ion-content>
The ng-repeat
directive needs to be on a child node from the ng-controller
.