需要在 angular 8 中添加动态 json 数据

Question

我的json数据是

{
    "status": "Sucess",
    "data": {
        "id": 3,
        "permissions": {
            "logentry": [
                {
                    "id": 2,
                    "name": "Can change log entry",
                    "status": 0
                },
                {
                    "id": 3,
                    "name": "Can delete log entry",
                    "status": 0
                },
                {
                    "id": 4,
                    "name": "Can view log entry",
                    "status": 0
                }
            ],
            "company": [
                {
                    "id": 29,
                    "name": "Can add company",
                    "status": 0
                },
                {
                    "id": 30,
                    "name": "Can change company",
                    "status": 0
                },
                {
                    "id": 31,
                    "name": "Can delete company",
                    "status": 0
                },
                {
                    "id": 32,
                    "name": "Can view company",
                    "status": 0
                }
            ],
            "contenttype": [
                {
                    "id": 17,
                    "name": "Can add content type",
                    "status": 0
                },
                {
                    "id": 18,
                    "name": "Can change content type",
                    "status": 0
                },
                {
                    "id": 19,
                    "name": "Can delete content type",
                    "status": 0
                },
                {
                    "id": 20,
                    "name": "Can view content type",
                    "status": 0
                }
            ],
            "moduletype": [
                {
                    "id": 25,
                    "name": "Can add module type",
                    "status": 0
                },
                {
                    "id": 26,
                    "name": "Can change module type",
                    "status": 0
                },
                {
                    "id": 27,
                    "name": "Can delete module type",
                    "status": 0
                },
                {
                    "id": 28,
                    "name": "Can view module type",
                    "status": 0
                }
            ]
        },
        "name": "manager"
    },
    "message": "Successful Response data"
}

我需要使用 angular 8 解析数据并在我的组件中获取权限内容这里的权限键像 lognetry, comapany, contenttype, moduletype 都是动态生成的。

我是新来的 angular 我试过这种方式来获取详细信息通过服务接收 json 数据并分配到 data

<div *ngFor="let item of data">
    <div *ngFor="let temp of item.permissions |keyvalue">
        <div *ngFor="let temp1 of temp|keyvalue ">
            Key: <b>{{temp1.key}}</b> and Value: <b>{{temp1.value}}</b>
        </div>
    </div>
</div>

我需要在我的组件中以这种方式打印所有数据的解决方案谁能帮帮我

Answer 1

您可以使用三个循环来实现它。

<div *ngFor="let permission_item of pemissions">
      <div *ngFor="let item of permission_item.permissions |keyvalue">
    
        Key: <b>{{item.key}}</b>
        <div *ngFor="let permissionObj of item.value">
          {{permissionObj.id}} {{permissionObj.name}} {{permissionObj.status}}
        </div>
        <br>
      </div>
      </div>

请评论您需要任何说明

需要在 angular 8 中添加动态 json 数据

need to prase dynamic json data in angular 8

parsing

json

dynamic

angular8