AngularJs (ng-repeat tr) + (ng-repeat td) + (ng-switch td) +

Question

     <tr ng-repeat="rows in DATA1">
            <INEEDSOMETAG ng-repeat="(key,part) in rows" ng-switch on="key">
                <td ng-switch-when="ABCD" ng-repeat="piece in part">{{piece}}</td>
                <td ng-switch-default>{{part}}</td>
            </INEEDSOMETAG>
      </tr>

此信息是从 JSON 对象解析的，其中一个"部分"是另一个对象，我需要遍历它，但将它们显示为另一个"TD"。

显然，如果可能的话，一种方法是提供某种动态标签（"INEEDSOME标签"）

下面有个JSON：

{obj1:  {
        ABCD:{
                x:'x',
                y:'y'
                },
        a:'a',
        b:'b',
        c:'c',
        d:'d',
    },
obj2:{
        ABCD:{
                z:'x',
                f:'y'
                },
        a:'a',
        b:'b',
        c:'c',
        d:'d',
    },
}

添加了一个 JSFIDDLE：http://jsfiddle.net/kDF5L/1/

Answer 1

首先要解决几个问题：

1. 您的<span>标签没有正确平衡;它们都以</td>结尾。
2. $scope.js不是有效的Javascript。一个对象必须包含键/值对，所以我认为你应该使用一个对象数组。

如果你真的想走这条路（正如评论员所建议的那样，这看起来不像是完成你想要做的任何事情的最 Angular 方法）——我做了一个 JSFiddle 来演示如何让代码开始做某事。

如果您仍然对制作像 <i-need-some-tag> 这样的自定义元素感兴趣（我假设此时您不需要这样做，尽管知道如何执行此操作对框架来说非常基础），您需要编写一个自定义指令。 如何做到这一点超出了这个问题的范围，但是在Stack Overflow，Google和AngularJS文档中有很多关于如何做到这一点的资源。你会从这样的东西开始：

.directive("INeedSomeTag", function() {
    return {
        restrict: 'E', // used like <i-need-some-tag>
        replace: true,
        template: `<td>...</td>` 
    }
});

就像 charlietfl 说的那样，您可以将<td>元素传递到指令定义对象的 template 属性中。