Unable to locate a supporting differ for object '[object Object]' classified as 'object'. --> Converting VirusTotal JSON for Table Presentation

Trying to extract and display VirusTotal JSON data in a table, but struggling with using the ngfor directive.

 scan(file) {

    this.http.get("api/Scanner/").subscribe(result => {
    this.value = result;
    console.log(this.value.scans);    
    });

    }

In Html File

<li *ngFor="let item of this.value.scans">
  {{item.version}}
</li>

   public class ScannerController : Controller
        {   [HttpGet]         
            public async Task<IActionResult> ScanAsync(string file_id)
            {
                //New Update //
                file_id = "./wwwroot/Upload/1";
                VirusTotal virusTotal = new VirusTotal("mykey");
                // virusTotal.UseTLS = true;         
                FileStream stream = System.IO.File.OpenRead(file_id);
                byte[] fileBytes = new byte[stream.Length];
               // stream.Seek(0, SeekOrigin.Begin);
                stream.Read(fileBytes, 0, fileBytes.Length);

                VirusTotalNet.Results.FileReport report = await virusTotal.GetFileReportAsync(fileBytes);
                bool hasFileBeenScannedBefore = report.ResponseCode == FileReportResponseCode.Present;

                Console.WriteLine("File has been scanned before: " + (hasFileBeenScannedBefore ? "Yes" : "No"));

                //If the file has been scanned before, the results are embedded inside the report.
                if (hasFileBeenScannedBefore)
                {
                   return Ok(report);
                }
                else
                {
                    ScanResult fileResult = await virusTotal.ScanFileAsync(fileBytes,"1");
                    return Ok(fileResult);

                }

            }
        }

Error

UploadComponent.html:8 ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

Update:

{Bkav: {...}, TotalDefense: {...}, MicroWorld-eScan: {...}, FireEye: {...}, CAT-QuickHeal: {...}, ...}
Bkav: {detected: false, version: "1.3.0.9899", result: null, update: "20200221"}
TotalDefense: {detected: false, version: "37.1.62.1", result: null, update: "20200225"}
MicroWorld-eScan: {detected: false, version: "14.0.409.0", result: null, update: "20200226"}
FireEye: {detected: false, version: "29.7.0.0", result: null, update: "20200226"}
CAT-QuickHeal: {detected: false, version: "14.00", result: null, update: "20200225"}
McAfee: {detected: false, version: "6.0.6.653", result: null, update: "20200226"}
Malwarebytes: {detected: false, version: "3.6.4.335", result: null, update: "20200225"}
Zillya: {detected: false, version: "2.0.0.4034", result: null, update: "20200225"}
SUPERAntiSpyware: {detected: false, version: "5.6.0.1032", result: null, update: "20200221"}
Sangfor: {detected: false, version: "1.0", result: null, update: "20200221"}
K7AntiVirus: {detected: false, version: "11.96.33381", result: null, update: "20200226"}
K7GW: {detected: false, version: "11.96.33380", result: null, update: "20200226"}
BitDefenderTheta: {detected: false, version: "7.2.37796.0", result: null, update: "20200211"}
F-Prot: {detected: false, version: "4.7.1.166", result: null, update: "20200226"}
Symantec: {detected: false, version: "1.11.0.0", result: null, update: "20200226"}
ESET-NOD32: {detected: false, version: "20902", result: null, update: "20200226"}
Baidu: {detected: false, version: "1.0.0.2", result: null, update: "20190318"}
TrendMicro-HouseCall: {detected: false, version: "10.0.0.1040", result: null, update: "20200226"}
Avast: {detected: false, version: "18.4.3895.0", result: null, update: "20200226"}
ClamAV: {detected: false, version: "0.102.2.0", result: null, update: "20200225"}
Kaspersky: {detected: false, version: "15.0.1.13", result: null, update: "20200226"}
BitDefender: {detected: false, version: "7.2", result: null, update: "20200226"}

Update: https://i.sstatic.net/eSJ9w.jpg

Answer â„–1

this.data.items is currently an object, not an array. To convert it into an array, we can follow these steps:

this.http.get("api/Items/").subscribe(response => {
    this.data = response;
    // The following code snippet will change the object into an array
    this.data.items = Object.keys(this.data.items).map(key => {
        return {
            ...this.data.items[key],
            itemName: key
        };
    });

});

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Managing a project with multiple tsconfig.json files: Best practices and strategies

I've got a project structured in the following way: \ |- built |- src |- perf |- tsconfig.json |- typings |- tsconfig.json My main tsconfig.json looks like this: "target": "es6", "outDir": "built", "rootDir": "./src", Now, I need to have a ...

Angular 2 - Dependency Injection failing to function

I have created two different implementations for an interface and assigned them as providers for two separate components. However, I am encountering the following error: Error: Can't resolve all parameters for ChildComponent: (?). What could be the i ...

The ngIf directive in Ionic 2 does not refresh after a user logs in

I'm facing an issue with the *ngIf directive in Ionic 2. Below is my code: <div *ngIf="isLogin" class="profile-info ng-binding padding text-center" (click)="openPage(accountPage)"> {{userEmail}} <span menu-toggle="menu-togg ...

Browse through websites without refreshing a shared component specific to those pages in Angular 2

Check out this example app: This is the main component of my Angular application: import { Component } from '@angular/core'; @Component({ selector: 'root', template: ` <h1>My Dummy Angular App</h1> <router-out ...

Looking to send a POST request with a particular object type

Currently, I am working with an abstract class called "Achievement" which has two subclasses: "ExhibitsVisitedAchievement" and "RouteFinishedAchievement". My goal is to create instances of these achievements by using a POST call to the relevant API endpoin ...

Guide on integrating the *Remember me* feature with the Amazon Cognito sdk

Seeking to incorporate a Remember Me feature for authentication process in an Angular2 project utilizing amazon-cognito-identity-js. Check out the details for this implementation at this issue link. Overview of current authentication procedure If the us ...

Why am I receiving an undefined value?

I am currently engaged in Angular4 development and have encountered an issue that I cannot seem to resolve. The problem arises when I attempt to store a value on the service provider and retrieve it from a component. Below is a snippet of my code: Service ...

Why do we need the TypeScript ts-jest pre-processor?

I am relatively new to TypeScript and JavaScript, so I have a question regarding the necessity of preprocessing modules like ts-jest for running Jest tests with TypeScript code. Currently, I am working on a TypeScript project in Node and everything seems t ...

Loop through the component name and route path in ReactJs to efficiently organize and structure your application

In my route file coding for ASP.NET, I am creating routes by fetching details from the backend. Successfully getting details like [Contacts, Pipelines, Stages]. import * as React from 'react'; import { BrowserRouter, Redirect, Route } from &apos ...

A guide on integrating an Angular component into a Node Express environment

When I send a GET request to this URL: http://localhost:5029/article/16 I check for article/16 within Node using: req.url.split("article/")[1]; and then try to render the component using handlebars like so: res.render('header', {layout: &apos ...

Ways to carry out two distinct actions following a successful service call with NGRX

I am currently working on a product search feature. The process involves dispatching a 'search_start' action with specific parameters for the search. This action triggers an effect that communicates with a service to retrieve a list of products b ...

An in-depth tutorial on integrating and managing npm packages in a fresh Angular project within Visual Studio 2019

After successfully setting up my first Angular application in Visual Studio 2019 using the .Net Core Web Application project type, I noticed that Angular 6.1.10 is currently being utilized. While I am aware of installing packages through the CLI, I am curi ...

The Angular functionality is reliant on the outcome of another function's HTTP response

Within my Angular application, there are various actions that can be taken on templates: Add Edit Stop Tracking Start Tracking Each action requires validation from the server before it can be performed. The flow is as follows: btn(click) -> checkStatu ...

Access data in an array using a specific index in Typescript

Here is the JSON format I am working with: { "records": [ { "ID": "4", "TYPE": "landscape", "FIMAGE": "viewveni.jpg", "COUNT": "4444" } ], "pagination": { "count": 1, "page": 1, "limit": 10, "totalpages": 1 } } I'm facing a challenge trying to retri ...

Steps for creating an empty array in a TypeScript function and dynamically adding objects to it with each function call

As I work with TypeScript and Angular, my goal is to establish an empty array in the testConnection function that can accommodate the addition of objects each time the function is triggered, without wiping out the existing contents of the array. This is t ...

Adaptively linking to the property of a deeply nested object

Attempting to bind to a property of a nested object using [(ngModel)], but facing the challenge that the path to the property is dynamically set. Consider the following three classes: class A { p1: C constructor() { p1 = new C("A") } } class B { p2: ...

Utilizing Pick to define a type that is a combination of multiple types

I am currently working on simplifying an existing interface by creating a new type. The original type is derived from @mui/x-data-grid and is as follows: export declare type GridEnrichedColDef<R extends GridValidRowModel = any, V = any, F = V> = Grid ...

Issue encountered while trying to import jszip in Angular project

Encountering an error when trying to import jszip into my TypeScript component file. After successfully running npm install jszip and confirming the package is properly installed, I proceed to import it using: import * as JSZip from 'jszip'; Th ...

What could be causing the Angular imports to not function properly?

I've recently set up a project, and it's compiling successfully. However, every time I attempt to add a directive like [formGroup], it throws an error such as "Property formGroup is not provided by any applicable directives nor by form element". ...

Angular compiler options paths are often overlooked

I'm facing an issue while developing an Angular application that utilizes xml2js. The error message I encountered is as follows: $ ng build â ¦ Building... ✘ [ERROR] Could not resolve "timers" node_modules/xml2js/lib/parser.js:36:25: 36 â ...