ng-repeat 嵌套和 KeyValuePair 列表答案

【问题标题】：ng-repeat nested and List of KeyValuePairng-repeat 嵌套和 KeyValuePair 列表
【发布时间】：2016-07-18 22:11:19
【问题描述】：

我的模型中有一个对象，其属性定义如下

List<KeyValuePair<DTO_AWTR, string>> AWTR_DRAWING

DTO_AWTR 是这样定义的另一个对象：

public partial class DTO_AWTR
{
    public string ITEM_NUMBER { get; set; }
    public string PLANT { get; set; }
    public string PLANT_EMAIL { get; set; }
}

在我看来，我想迭代抛出列表中的所有元素，但出现了问题。我看到行数，但有空字段。

<table>
    <tr ng-repeat="draw in dataItem.AWTR_DRAWING">
        <td ng-repeat="(key, value2) in draw"></td>
        <td>{{ key.PLANT }}</td>               
    </tr>
</table>

您对这个问题有什么建议吗？

【问题讨论】：

标签： c# angularjs asp.net-mvc ng-repeat keyvaluepair

【解决方案1】：

你在这里提到的结构List<KeyValuePair<DTO_AWTR, string>> AWTR_DRAWING序列化为

[{key : {ITEM_NUMBER : "", PLANT : "", PLANT_EMAIL:""}, value : ""}, ...]

所以你应该使用 ng-repeat 记住这个结构。

<table>
    <tr ng-repeat="draw in dataItem.AWTR_DRAWING">
        <!--this will contain {key : {object structure}, value : ""} -->
        <td ng-repeat="(key, value2) in draw.key" ng-bind="key"></td>
        <!--this will contains key = "ITEM_NUMBER|PLANT|PLANT_EMAIL"-->              
    </tr>
</table>

**注意 - 取决于你可能使用的最有可能 newtonsoft json 的 js 序列化程序。对象键可能是驼峰式

【讨论】：

所以最好用驼峰式表示法调用对象键？还有 DTO_AWTR 的属性？
看来是第二次迭代不行。如果我在第一次迭代后添加一行，我可以看到我的对象 <td>{{draw}}</td>
我已经编辑了我的答案。早些时候试图将 {{key}} 放在一个单独的 td 元素上，这显然是错误的

【解决方案2】：

试试这个：

<table>
    <tr ng-repeat="draw in dataItem.AWTR_DRAWING">
        <td>{{ draw.key.PLANT }}</td>               
    </tr>
</table>

【讨论】：

我不明白为什么你有 2 次重复.. 你只有一个列表。您使用第一个 ng-repeat 在该列表中导航。因此，您的绘图对象包含一个 KeyValuePair 对象。您需要从那里获得 Key 属性（我不确定 K 是否为大写）。 Key 属性包含一个 DTO_AWTR 对象。从该对象中，您需要 PLANT 属性。所以在我看来应该是draw.key.PLANT。如果您尝试显示 draw.Key 属性会显示什么？