Javascript 如何在angular js中使用标题创建动态表

我想根据json中的机器选择级别。。我将使用ajax调用从服务器获取数据

下面是一些场景 Json回复如下：

{“MVXR”：[{“levelId”：1，“levelName”：“L2”}，{“levelId”：2，“levelName”：“L3”}，{“levelId”：3，“levelName”：“L4”}]，“CVI”：[{“levelId”：3，“levelName”：“L4”}]，“BPI”：[{“levelId”：2，“levelName”：“L3”}]

有时可能会出现空响应，然后我需要将所有复选框显示为false

json响应 {}

我需要一些指导如何在angularjs中实现所有逻辑

---

我需要使用指令吗。我还需要创建动态的头。

您应该首先将JSON对象转换为可以在DOM上使用ng repeat轻松遍历的对象，以完成输出

(function initController(){
    // calling the service and getting the JSON object
    var machines = {
        "MVXR": [  {  "levelId": 1, "levelName": "L2"}, 
                   { "levelId": 2, "levelName": "L3" },
                   { "levelId": 3, "levelName": "L4" }  ],
        "CVI":  [  { "levelId": 3, "levelName": "L4" }  ],
        "BPI":  [  { "levelId": 2, "levelName": "L3" }  ]
    };
    transfromReponse(machines);
})();

function transfromReponse(machines){ // pass your JSON object
    $scope.machineAndLevels = [];
    angular.forEach(machines, function(levelArray, key){
        var machine = {
            name: key,
            L2: false,
            L3: false,
            L4: false
        };
        angular.forEach(levelArray, function(level){
            machine[level.levelName] = true;
        });
        $scope.machineAndLevels.push(machine);
    });
}

然后用ng repeat很容易地穿过这个变形的物体

<div class="row" ng-show="machineAndLevels.length > 0">
    <table class="table table-bordered">
        <thead>
            <td> Machines </td>
            <td> Level 2</td>
            <td> Level 3 </td>
            <td> Level 4 </td>        
        </thead>
        <tr ng-repeat="machine in machineAndLevels">
            <td> {{machine.name}} </td>
            <td> <input type="checkbox" ng-model="machine.L2"> </td>
            <td> <input type="checkbox" ng-model="machine.L3"> </td>
            <td> <input type="checkbox" ng-model="machine.L4"> </td>
        </tr>
    </table>
</div>

机器
二级
三级
四级
{{machine.name}

您的意思是，您希望通过从服务器得到的响应来创建表的标题，而不仅仅是标题。。我还想选择机器可用的复选框？请看附件中的图片？这里LevelName可以是任何东西，因为用户可以在数据库中输入任何数据。因此，在transformresponse方法中，我不能硬编码为key.var machine={name:key，level2:false，level3:false，level4:false}；forEach（levelArray，函数（level）{var key='level'+（level.levelId+1）；machine[key]=true；}）；[{“名称”：“MVXR”，“L2”：真，“L3”：真，“L4”：真}，{“名称”：“CVI”，“L2”：假，“L3”：假，“L4”：真}，{“名称”：“BPI”，“L2”：假，“L3”：真，“L4”：假}]