Oops! Something went wrong - it seems like there was an issue trying to access the property 'Date/Heure' of

When my web application uploads a .mes file, it retrieves data and manipulates it to insert into an Object. Initially, the object is empty, but after uploading the file, the data appears.

I am trying to display the 'date' obtained from the .mes file using this code:

Production date : {{ jsonToDisplay[0]['Date/Heure']['Date'] }}

In the end, jsonToDiplay contains a variety of data and never follows the same "model", so I cannot create a standard template for it. Additionally, I have experimented with async methods without success; at initialization, jsonToDisplay is set to an empty array.

Answer №1

In order to correct the issue, the usual solution would be to use this code: {{ jsonToDisplay[0]?.Date/Heure?.Date }}, however, due to the presence of 'Date"/"Heure, it is not feasible.

Therefore, I opted to store the value in a new variable in TypeScript and that resolved the problem successfully

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

Locate the nearest index within the array

I'm currently working with an array of "events" where the key assigned to each event corresponds to the Unix Timestamp of that particular event. To illustrate, consider the following array of event objects in JS: var MyEventsArray=[]; MyEventsArray[1 ...

Utilize the append method to reference an element within a $.getJSON() call

Attempting to obtain a JSON list and add it: $.getJSON("url", function(data){ $('#tbl').append("<li id="listitem">asd</li>); }); The code successfully appends the list, but there is an issue accessing the li ...

Tips for accurately typing a "Type Mapping" function

In my code, I have a specific type designed for a function that takes one type I as input and returns another type O as output. Here is how it currently looks: export interface IFunctionalMapping<I, O, K extends keyof O> { [prop: Extract<O[K], ...

Retrieving an item within another item

I'm attempting to retrieve the value of usertype within the result object, but I'm encountering issues with this. Here's what I've tried so far: if(data.result.usertype === 2){ console.log("redirect to type 2 user") } else if(data.re ...

Fetch all items in JSON and store them in a Python list

Extracted from the JSON response obtained from this link {'batchcomplete': '', 'query': {'pages': {'24482718': {'pageid': 24482718, 'ns': 0, 'title': 'Web Bot', &apo ...

Angular 8 HTTP Interceptor causing issues with subscriptions

I'm currently in the process of setting up an Angular 8 project that will allow me to mock API calls using HTTP INTERCEPTORS. My approach involves adding a --configuration=mock flag to my ng serve script so that the interceptor is injected into my app ...

Is there a way to parse a JSON file and present its data in a TableView using JavaFX?

This particular concept is causing me some difficulty. I possess a local JSON file labeled customers.json, which houses information on 1000 customers. "Customers": [{ "id": 1, "gender": "female", "fi ...

Leveraging XML data encoded into JSON with PHP

I recently developed a PHP file to retrieve data from an API. A typical response from the API would look like this: { @attributes: { Status: "OK" }, Errors: { }, Warnings: { }, RequestedCommand: "checking", CommandResponse: { @attributes: { ...

What is the most effective method for integrating templates using AngularJS and Webpack2?

UPDATE: I haven't come across a method to import templates using an import statement rather than require, but I have realized that I can streamline my configuration. In the webpack config, opt for html-loader over ngtemplate-loader for /\.html$/ ...

The component is expected to return a JSX.Element, however it is failing to return any value

The issue lies with this component: const NavigationItems = (props: {name: string, href: string}[]): JSX.Element => { props.map((item, index) => { return <a href={item.href} key={index}>{item.name}</a> }) }; export default Naviga ...

Updating information on <element>

Having trouble with the <object> element. I'm trying to display different external pages, but it's not functioning properly. It seems like once I set the data for the first time, any subsequent changes have no effect. Do I need to refresh i ...

It is not necessary to specify a generic type on a Typescript class

When working with Typescript and default compiler options, there are strict rules in place regarding null values and uninitialized class attributes in constructors. However, with generics, it is possible to define a generic type for a class and create a ne ...

Angular - a simple method to determine the number of non-empty inputs in a complex template-driven form

As I work on multiple substantial Angular 11 template forms containing basic inputs like text, radiolists, and checkboxes, I am looking for the most effective method to calculate the percentage of completed inputs while the user is actively engaging with ...

Getting the Nth Keys from a Struct in Python

I have a JSON with nested structs or lists, and I need to extract all the nth keys from it after parsing through them. While I have managed to do this recursively in Python, I am looking for help on how to solve this iteratively. Any assistance with this p ...

Understanding the behavior of the enter key in Angular and Material forms

When creating forms in my MEAN application, I include the following code: <form novalidate [formGroup]="thesisForm" enctype="multipart/form-data" (keydown.enter)="$event.preventDefault()" (keydown.shift.enter)="$ev ...

Tips on duplicating objects in TypeScript with type annotations

My goal is to inherit properties from another object: interface IAlice { foo: string; bar: string; }; interface IBob extends IAlice { aFunction(): number; anotherValue: number; }; let alice: IAlice = { foo: 'hi', bar: 'bye&apo ...

Formulate a Generic Type using an Enum

I'm currently working on a project that involves creating a generic Type using enums. Enum export enum OverviewSections { ALL = 'all', SCORE = 'score_breakdown', PERFORMANCE = 'performance_over_time', ENGAGEMENT ...

Modify the color of an Ionic button for a single button, rather than changing the color for all buttons

How can I modify this code so that only the clicked button changes its color, not all of them? Here is the current code: .html: <ion-col size="6" *ngFor="let data of dataArray" > <ion-card> <ion-card-header> ...

Utilizing Hashmap to retrieve and showcase thumbnail images from a JSON webservice: a tutorial

I utilized a hashmap to display images in a listview using data obtained from a JSON webservice. However, I am facing issues with displaying the images in the listview. Here is the source code I am using: public class New_PDF_List extends Activity { ...

"Java is experiencing a memory overload issue, resulting in a Stack Overflow error

Struggling with implementing a Camel Route that calls a URL and converts the JSON Response into Pojo using Camel-Jackson. The connection is established with a status of 200, but encountering an issue: at com.fasterxml.jackson.databind.ser.BeanPropertyWri ...