ayilmaz ayilmaz - 1 month ago 10
AngularJS Question

How to display single row in ng-repeat, in Angularjs

I am very new to AngularJs and trying to use it in my project. I made a WebApi function that returns a city's current temperature. From html, I want to get that single temperature and display it. I know ng-repeat is used to display many items but how to display a single item.

my current code is below. I expected to display "20" as temperature, but it displays "2" and "0" in two rows :) Please help. How can I display it as "20" in a single row?

<div ng-controller="WearherController">
<table ng-repeat="weather in weathers" border="1">
<tr>
<td>{{weather}}</td>
</tr>
</table>
</div>
....
....
....
<script>
var app = angular.module("ZenHaberApp", []);
app.controller("WeatherController", function ($scope, $http) {
var city = 'Adana';
$http.get('http://localhost:62747/api/getweatherbycityname/' + city).
success(function (data, status, headers, config) {
$scope.weathers = data.condition_temp;

}).
error(function (data, status, headers, config) {
alert("error");
});
});
</script>


I think @Sajeetharan gave me the solution but now it displays a silly image. What is it? How can I fix this?
enter image description here

here is the rest of the code

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js"></script>
<script>
var app = angular.module("ZenHaberApp", []);
app.controller("WeatherController", function ($scope, $http) {
var city = 'Adana';
$http.get('http://localhost:62747/api/getweatherbycityname/' + city).
success(function (data, status, headers, config) {
$scope.weathers = data.condition_temp;

}).
error(function (data, status, headers, config) {
alert("error");
});
});
</script>


SOLUTION:

thanks to @Sajeetharan, he found out the problem. It was {{weather}}

It should be {{weathers}}

Answer

You can directly assign the $scope variable weathers,

<table border="1">
        <tr>
            <td>{{weathers}}</td>
        </tr>
 </table>

DEMO