Question

我有以下数据和HTML模板（以及app.js中的其他代码）。我的“tbody”中的代码完美无缺，并显示如下表格：

当前输出

model2$coefficients

现在我试图遍历第一个对象的'keys'并将它们显示在'thead'中，如下所示：

所需的输出

--------------------
| AAPL | 127 | 128 |
--------------------
| GOOG | 523 | 522 |
--------------------
| TWTR |  35 |  36 |
--------------------

数据

--------------------
| Name | jan | feb |
--------------------
| AAPL | 127 | 128 |
--------------------
| GOOG | 523 | 522 |
--------------------
| TWTR |  35 |  36 |
--------------------

HTML

$scope.data = [
{  
    "name": "AAPL",
    "jan": "127",
    "feb": "128"
},
{
    "name": "GOOG",
    "jan": "523",
    "feb": "522"
},
{
    "name": "TWTR",
    "jan": "35",
    "feb": "36"
}]

有人指出这个问题与另一个问题重复，但另一个问题是普通的JS，这个问题使用的是AngularJS。

Answer 1

如果您使用underscoreJS（这是一个非常常见且称职的便利库），那么第一个对象的you can get the keys就像这样：

_.keys(data[0])

这假设阵列中的所有元素都具有相同的键和键。结构体。看起来像，所以你应该安全。

在您的应用中包含UnderscoreJS后，您可以在括号中的表达式中使用模板调用它：

 <td ng-repeat="">{{ _.keys(data[0])}}</td>

Pure ES5解决方案

如果你对图书馆的困难，你可以忍受ES5，那么你可以使用

Object.keys(data[0])
<td ng-repeat="">{{ Object.keys(data[0]) }}</td>

Answer 2

return render(request, 'template.html', status=204)

您只需要考虑键值始终以相同的顺序出现，否则表格将以错误的顺序显示值。

Answer 3

You use use Angular's (key, value) syntax.但是，我不认为这会对你的情况有效，因为迭代的顺序是随机的。

我认为你最好的办法是硬编码/** * */ package com.gmail.neonblue858.remoteconsole.plugin; import java.util.logging.Level; import java.util.logging.Logger; import org.bukkit.scheduler.BukkitRunnable; /** * * *@author Meguy26 * */ public class FilterApplyer extends BukkitRunnable { private ClientManager man; public FilterApplyer(ClientManager man){ this.man = man; } /* (non-Javadoc) * @see java.lang.Runnable#run() */ @Override public void run() { //Create handler LogHandler handler = new LogHandler(man); //Set handler to capture everything handler.setLevel(Level.ALL); //Add handler to root logger so it applies to all loggers Logger.getLogger("").addHandler(handler); //Set the system out to a filtering output stream System.setOut(new FilterOutputStream(System.out, man)); //Set the system err to a filtering output stream System.setErr(new FilterOutputStream(System.err, man)); } }变量中的密钥或更新数据格式（如果你可以控制它的生成方式），以便指定密钥的顺序。

Answer 4

@murid，你需要这个：

在head的脚本标签中：

var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope) {
    $scope.data = [{
        "name": "AAPL",
            "jan": "127",
            "feb": "128"
    }, {
        "name": "GOOG",
            "jan": "523",
            "feb": "522"
    }, {
        "name": "TWTR",
            "jan": "35",
            "feb": "36"
    }];
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
    <table>
        <thead>
            <tr>
                <td ng-repeat="">{{}}</td>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="object in data">
                <td ng-repeat="(a,b) in object">{{b}}</td>
            </tr>
        </tbody>
    </table>
</div>

希望得到这个帮助。

如何使用AngularJS遍历对象的“键”值？

4 个答案:

Pure ES5解决方案