Question

所以我有一份产品清单;他们的列动态地从两个变化。将始终存在id列和名称列。如何在不知道它们是什么的情况下使用ng-repeat来显示其他列的值？

Answer 1

我不确定你正在寻找什么样的布局，但这样的事情基本上会占用一个对象的所有成员并将它们抛入一个可以用ng-repeat迭代的数组中。

<html>
<head>
    <link rel="stylesheet" 
</head>
<body ng-app="app" ng-controller="myController as ctrl">
    <table>
        <tr ng-repeat="room in ctrl.rooms | filter: ctrl.expand">
            <td ng-repeat="prop in room.props">
                {{room[prop]}}
            </td>
        </tr>
    </table>

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js "></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js "></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js "></script>
    <script>
        angular.module("app",[]).controller("myController", myController)

    function myController() {
        var vm = this

        vm.rooms = [
            {
                name: 'Room 1',
                floor: 1,
                carpet: "shag"
            },
            {
                name: 'Room 2',
                doors: 2,
                windows: 4
            },
            {
                name: 'Room 3',
                size: "12x12",
                color: "green"
            }
        ];

        vm.expand = function(room) {
        if (!room.props) {
            room.props=[];
            for (var prop in room) {
                if (prop.indexOf("$") != 0  && prop !=="props") {
                    room.props.push(prop)
                }
            }
        }
        return true;
        }
    }
    </script>
</body>
</html>

没有函数调用，您也可以使用以下内容：

<div ng-repeat="room in ctrl.rooms">
    <div ng-repeat='(key, val) in room'>
        <p>{{key}}: {{val}}</p>
    </div>
</div>

Answer 2

不完全确定您在此处使用的内容，但您可以使用过滤器和ng-repeat筛选出数据。

Link to SO on that topic.

AngularJS ng-repeat动态列

2 个答案: