简体   繁体   English

如何在Angularjs中的ng-repeat中显示单行

[英]How to display single row in ng-repeat, in Angularjs

I am very new to AngularJs and trying to use it in my project. 我是AngularJs的新手,正在尝试在我的项目中使用它。 I made a WebApi function that returns a city's current temperature. 我制作了一个WebApi函数,该函数返回城市的当前温度。 From html, I want to get that single temperature and display it. 从html,我想获取单个温度并显示它。 I know ng-repeat is used to display many items but how to display a single item. 我知道ng-repeat用于显示许多项目,但如何显示单个项目。

my current code is below. 我当前的代码如下。 I expected to display "20" as temperature, but it displays "2" and "0" in two rows :) Please help. 我希望将“ 20”显示为温度,但它在两行中显示“ 2”和“ 0” :)请帮助。 How can I display it as "20" in a single row? 如何在单行中将其显示为“ 20”?

<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. 我认为@Sajeetharan给了我解决方案,但现在它显示了一个愚蠢的形象。 What is it? 它是什么? How can I fix this? 我怎样才能解决这个问题? 在此处输入图片说明

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. 感谢@Sajeetharan,他找到了问题所在。 It was {{weather}} 当时{{天气}}

It should be {{weathers}} 应该是{{weathers}}

You can directly assign the $scope variable weathers , 您可以直接分配$ scope变量weathers

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

DEMO 演示

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM