Populating the HTML page with the JSON data in Angular

I have the following JSON data but would like to implement the HTML page such that it shows the parent as the header and all the children under the same parent under the content and then follow on by the second parent as the header and all the children under the second parent under the content. How would I be able to do so? An example would be like the following.

Sample 1

Product 1 – Test Product 1

Product 2 – Test Product 2

Sample 2

Product 1 – Test Product 1

sampleList": [
        {
    "parent": "Sample 1",
    "children": [
        {
            "product": "Product 1",
            "name": "Test Product 1",
        }
    ],
    "parent": "Sample 1",
    "children": [
        {
            "product": "Product 2",
            "name": "Test Product 2",
        }
    ],
    "parent": "Sample 2",
    "children": [
        {
            "product": "Product 1",
            "name": "Test Product 1",
        }
    ]
}
]