Error : Error trying to diff '[object Object]'. Only arrays and iterables are allowed

Question

I have a API which returns the below JSON

{
  "error": false,
  "success": true,
  "response": "{\"events\": [\"_campaign.send\", \"_SMS.FAILURE\", \"_SMS.SUCCESS\", \"_email.open\", \"_email.delivered\", \"_email.send\", \"_test.event_stream\"], \"count\": [4, 3, 2, 2, 1, 1, 1]}"
}

in Angular Application I am just printing the response on the console

 this.http.post(environment.getCampaignEvents, {
      "": "",
  }).subscribe(data => {

          this.campaignEvents = data;
          //this.spinner.hide();

          if (this.campaignEvents.success === false) {
              console.log('Get Campaign events = fail');
              this.statusText = this.campaignEvents.msg;
              this.campaignEventsResponseMessage = this.statusText;
              this.toasterService.pop('error', 'Error!', this.campaignEventsResponseMessage);

              this.campaignEventsResponseMessage = this.campaignEventsResponseMessage.msg;
          } else {
              console.log('Get Campaign events = passed');
              this.CampaignList=this.campaignEvents.response;
              this.CampaignList = JSON.parse(this.CampaignList);
              console.log(this.CampaignList);
          }
      }

by this line console.log(this.CampaignList); I am getting the error on the browser The errors are multiplied and keep on throwing the error on the browser.

yes i have defined all the variables used above as 'any' @NicholasK — Santhosh
– Santhosh, Commented Sep 9, 2019 at 11:35
I am able to print the response also on the browser along with that errors are populating on the browser @NicholasK — Santhosh
– Santhosh, Commented Sep 9, 2019 at 11:40
I doubt the console.log is causing the errors. Did you try debugging? Maybe on the template you are trying to iterate over an array when you have an object - hence the error. — Nicholas K
– Nicholas K, Commented Sep 9, 2019 at 11:41
the response has an array may be printing that on the console is causing the error but I am not sure that it is the one causing the error @NicholasK — Santhosh
– Santhosh, Commented Sep 9, 2019 at 11:44

ForestG · Accepted Answer · 2019-09-09 11:58:25Z

1

I think the error is not the caused by the console.log. See the error you get: the problem arises in at Object.eval [as updateDirectives](CampaignManagementComponent.html:24)

I suggest you surround the said line (24) with something that prevents it's rendering until the data it requires is present. (probably an *ngFor structural directive where you give a null or on object instead of an array is my guess. (I mean the data you bind is null or object by the time it renders first - try to halt it's rendering until the http call finishes)

answered Sep 9, 2019 at 11:58

ForestG

18.2k16 gold badges64 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Error : Error trying to diff '[object Object]'. Only arrays and iterables are allowed

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related