javascript - Angular js function logic and repetition error -

javascript - Angular js function logic and repetition error -

i'm having logic error code using angular js. have done made function loops through json array , returns strings of weather condition, eg 'clear', 'cloudy', etc... checks see if value of string equal string. if is, returns image link associated weather condition. problem html ng-repeat function repeating 1 image , not other image. here js:

var app=angular.module('app'); app.controller('mainctrl', function($scope, $http) { $scope.currentsydney = null; $scope.currentmelbourne = null; $scope.currentadelaide = null; $scope.currentdarwin = null; $scope.currentbrisbane = null; $scope.currentmelbourne = null; $scope.currentcairns = null; $http.jsonp('http://api.wunderground.com/api/5ad0204df4bdbeff/conditions/q/australia/melbourne.json?callback=json_callback').success(function(data){ $scope.currentmelbourne=data; }); $http.jsonp('http://api.wunderground.com/api/5ad0204df4bdbeff/conditions/q/australia/sydney.json?callback=json_callback').success(function(data){ $scope.currentsydney=data; }); $http.jsonp('http://api.wunderground.com/api/5ad0204df4bdbeff/conditions/q/australia/adelaide.json?callback=json_callback').success(function(data){ $scope.currentadelaide=data; }); $http.jsonp('http://api.wunderground.com/api/5ad0204df4bdbeff/conditions/q/australia/darwin.json?callback=json_callback').success(function(data){ $scope.currentdarwin=data; }); $http.jsonp('http://api.wunderground.com/api/5ad0204df4bdbeff/conditions/q/australia/perth.json?callback=json_callback').success(function(data){ $scope.currentperth=data; }); $http.jsonp('http://api.wunderground.com/api/5ad0204df4bdbeff/conditions/q/australia/cairns.json?callback=json_callback').success(function(data){ $scope.currentcairns=data; }); $http.jsonp('http://api.wunderground.com/api/5ad0204df4bdbeff/conditions/q/australia/brisbane.json?callback=json_callback').success(function(data){ $scope.currentbrisbane=data; $scope.citydata=[ { name:'brisbane', temp:$scope.currentbrisbane.current_observation.temp_c, image:$scope.currentbrisbane.current_observation.icon }, { name:'melbourne', temp:$scope.currentmelbourne.current_observation.temp_c, image:$scope.currentmelbourne.current_observation.icon }, { name:'adelaide', temp:$scope.currentadelaide.current_observation.temp_c , image:$scope.currentadelaide.current_observation.icon }, { name:'darwin', temp:$scope.currentdarwin.current_observation.temp_c , image:$scope.currentdarwin.current_observation.icon }, { name:'perth', temp:$scope.currentperth.current_observation.temp_c , image:$scope.currentperth.current_observation.icon }, { name:'cairns', temp:$scope.currentcairns.current_observation.temp_c, image:$scope.currentcairns.current_observation.icon }, ] for(y = 0 ; y < 6; y++){ var string = $scope.citydata[y].image; console.log(string[10]); } }); $scope.iconstring = function() { switch ($scope.currentsydney.current_observation.icon) { case 'partlycloudy' : homecoming 'pics/partlycloudy.png'; case 'clear' : homecoming 'pics/partlycloudy.png'; } } $scope.repeat = function() { for(y = 0 ; y < 1; y++){ var string = $scope.citydata[y].image; if(string=='mostlycloudy'){ homecoming 'pics/mostlycloudy.png'; } } } });

and here html:

<div id="weather-container"> <div id="current-weather"> <!--angular json pull --> <div id="title"><span id="current-title">current weather</span></div> <div id="current-condition">{{currentsydney.current_observation.weather}}</div> <img ng-src="{{iconstring()}}"></img> <div id="current-temp"><span id="current-temp"> {{currentsydney.current_observation.temp_c}} </span></div> <span id="current-city">{{currentsydney.current_observation.display_location.city}} </span> </div> <!--angular json pull , iteration--> <div id="other-city-container"> <div class="other-city-weather" ng-repeat="city in citydata" > <!--image--> <img ng-src="{{repeat()}}"></img> <div class="current-city-temp"> <span>{{city.temp}}</span> </div> <div class="current-city-lower"> <span>{{city.name}}</span> </div> </div> </div> </div>

now i'm calling repeat function in html within img src tag.

`

i see. making 2 loops : ng-repeat in view, , loop in controller ( repeat() ).

but think right now, they not related each other (which need guess): getting index of ng-repeat loop in repeat method.

try :

in view :

<img ng-src="{{repeat($index)}}" /><!-- getting current $index of ng-repeat loop , passing $scope.repeat() method -->

in controller :

$scope.repeat = function(index) { // there, index becomes value set in view ($index = current index of ng-repeat loop), e.g. : 0,1,2,3... var string = $scope.citydata[index].image; // go right city in citydata array, according current ng-repeat index. // job if(string=='mostlycloudy'){ homecoming 'pics/mostlycloudy.png'; } }

not sure works didn't test it, may know mean ?

javascript jquery html angularjs