Having component's property called publicArray you can you can achive that by writing the following template:

<table *ngIf="publicArray?.settings?.length && publicArray.settings[0].data?.length">
  <tr>
    <th>ID</th>
    <th *ngFor="let header of publicArray.settings[0].data">{{ header.title }}</th>
  </tr>
  <tr *ngFor="let row of publicArray.settings">
    <td>{{ row.id }}</td>
    <td *ngFor="let col of row.data">
      {{ col.value }}
    </td>
  </tr>
</table>

Ng-run Example

The solution you are looking for is in Angular's official tutorial. In this tutorial Phones are loaded from a JSON file using Angulars $http service . In the code below we use $http.get to load a phones.json file saved in the phones directory:

var phonecatApp = angular.module('phonecatApp', []);   
phonecatApp.controller('PhoneListCtrl', function ($scope, $http) {
 $http.get('phones/phones.json').success(function(data) {
$scope.phones = data;
}); 
$scope.orderProp = 'age';
});

We then iterate over the phones:

<table>
  <tbody ng-repeat="i in phones">
    <tr><td>{{i.name}}</td><td>{{$index}}</td></tr>
    <tr ng-repeat="e in i.details">
       <td>{{$index}}</td>
       <td>{{e.foo}}</td>
       <td>{{e.bar}}</td></tr>
  </tbody>
</table>

There are many ways to display the json data in angular, you can bind your json as

1. ng-repeat

      <tr ng-repeat="values in data"> 
   

2. nested ng-repeat depending on the json format

3. ng-repeat with 'track by' while dealing with index values

       <tr ng-repeat="item in rows">
             <td>{{item.project}}({{item.task}})</td>
             <td  ng-repeat="values in item.hour track by $index">
            <input type="number" ng-model="item.hour[$index]"/>    
             </td>
       </tr>
   

4. ng-repeat with key value pairs

       <tr ng-repeat="(key, value) in data">
        <td> {{key}} </td> <td> {{ value }} </td>
       </tr>
   

In your case, best option is to use basic ng-repeat as

   <tr ng-repeat="values in data">
      <td>{{values.keycolumn1}}</td>
      <td>{{values.originkey1}}</td>
      <td>{{values.datafield1}}</td>
   </tr>

You need a function to transform your data into an array so that it can be displayed on the template.

Write a function like this

  transformData(rawData: any) {
    let processedData: Array<Candle> = [];
    Object.keys(rawData["Time Series (Daily)"] || []).forEach(key => {
      processedData.push({
        date: new Date(key),
        open: rawData["Time Series (Daily)"][key]["1. open"],
        high: rawData["Time Series (Daily)"][key]["2. high"],
        low: rawData["Time Series (Daily)"][key]["3. low"],
        close: rawData["Time Series (Daily)"][key]["4. close"],
        volume: rawData["Time Series (Daily)"][key]["5. volume"]
      });
    });
    return processedData;
  }

and call it once the data is received from the service

something like

this.ativoData = this.transformData(this.rawData);

and in temple

<div class="container-analyzer">
    <table>
        <thead>
            <th>Date</th>
            <th>Open</th>
            <th>High</th>
            <th>Low</th>
            <th>Close</th>
            <th>Volume</th>
        </thead>
        <tbody *ngFor="let candle of ativoData">
            <tr>
                <td>{{candle.date | date}}</td>
                <td>{{candle.open}}</td>
                <td>{{candle.high}}</td>
                <td>{{candle.low}}</td>
                <td>{{candle.close}}</td>
                <td>{{candle.volume}}</td>
            </tr>
        </tbody>
    </table>
</div>

Here is a working sample

If you can to do it, I think that you must change the form of your json for some more homogeneous, where you have an array with values and a separate key to access data and label individually:

items = [
  {
    "label": "This item has 1 value",
    "values": [1]
  },
  {
    "label": "Another",
    "values": [30]
  },
  {
    "label": "Item with multiple values",
    "values": [ 1, 2, 3, 4, 5]
  },
  {
    "label": "Another with multiple values",
    "values": [ 45.5, 45.0, 44.7, 45.8, 45.9]
  },
  {
    "label": "Single value",
    "values": [2]
  }
];

This way you can render your data easily:

 <table>
  <tr>
    <th>Name</th>
  </tr>
  <tr *ngFor="let item of items ">
    <td>{{item.label}}</td>
    <td *ngFor="let value of item.values">
      {{value}}
    </td>
  </tr>  
</table> 

Only as a first aprroach.