title: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays. solution?
body: <p>I have API call which like this</p>
  
  <p><a href="https://stackblitz.com/edit/angular-ngfor-simple-nbh4sn" rel="nofollow noreferrer">DEMO</a> </p>
  
  <p><br><b>Component:</b></p>
  
  <pre><code>this._newTripApi.getData().subscribe(selected =&gt; {
            this.selectedSettings = selected;
            this.isLoading = false;
          })
  </code></pre>
  
  <p><b>Service:</b></p>
  
  <pre><code>public getData(): Observable&lt;any&gt; 
  {
        return this._api.get(`instances/${this._config.getData().user.instance._id}?fields=newTripSettings`)
              .map(res =&gt; res.data.newTripSettings);
  }
  </code></pre>
  
  <p>When i use res.json() it says json is not a function, JSON response is shown below, i need to show all newtripSettings object in compopnent html but it says:
  Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays. solution?</p>
  
  <pre><code>{
    "data": {
      "_id": "5aaab927c756c86c15d3b1dc",
      "newTripSettings": {
        "betweenSites": {
          "enabled": true,
          "consultation": {
            "enabled": true
          },
          "radiotherapy": {
            "enabled": true
          },
          "chemotherapy": {
            "enabled": true
          },
          "dialysis": {
            "enabled": true
          },
          "coronarography": {
            "enabled": true
          },
          "scan": {
            "enabled": true
          },
          "transfer": {
            "enabled": true
          },
          "urgentPatientStop": {
            "enabled": true
          },
          "urgentOther": {
            "enabled": true
          },
          "otherPaidByHospital": {
            "enabled": true
          },
          "otherPaidByPatient": {
            "enabled": true
        },
        "fromSite": {
          "enabled": true
          "discharge": {
            "enabled": true
          },
          "consultation": {
            "enabled": true
          },
          "radiotherapy": {
            "enabled": true
          },
          "chemotherapy": {
            "enabled": true
          },
          "dialysis": {
            "enabled": true
          },
          "coronarography": {
            "enabled": true
          },
          "scan": {
            "enabled": true
          },
          "urgentPatientStop": {
            "enabled": true
          },
          "urgentOther": {
            "enabled": true
          },
          "otherPaidByHospital": {
            "enabled": true
          },
          "otherPaidByPatient": {
            "enabled": true
          }
        },
        "toSite": {
          "enabled": true,
          "hospitalisation": {
            "enabled": true
          },
          "consultation": {
            "enabled": true
          },
          "radiotherapy": {
            "enabled": true
          },
          "chemotherapy": {
            "enabled": true
          },
          "dialysis": {
            "enabled": true
          },
          "coronarography": {
            "enabled": true
          },
          "scan": {
            "enabled": true
          },
          "otherPaidByHospital": {
            "enabled": true
          },
          "otherPaidByPatient": {
            "enabled": true
          }
        },
        "other": {
          "enabled": true,
          "discharge": {
            "enabled": true
          },
          "hospitalisation": {
            "enabled": true
          },
          "consultation": {
            "enabled": true
          },
          "radiotherapy": {
            "enabled": true
          },
          "chemotherapy": {
            "enabled": true
          },
          "dialysis": {
            "enabled": true
          },
          "coronarography": {
            "enabled": true
          },
          "scan": {
            "enabled": true
          },
          "otherPaidByPatient": {
            "enabled": true
          }
        }
      }
    }
  }
  </code></pre>