Starting a nested JSON structure with TypeScript and Angular 7

I'm encountering an error when attempting to make a POST request by sending an object

TypeError: Can not set property 'ItemCode' of undefined

My setup involves Angular 7 and Typescript

Here is my initial JSON:

    objEnvio:any = <any> {
        DocumentLines:<any>[]
    };

This is the code snippet triggering the error:

    Cadastrar() {
        var today = new Date();
        var self = this;
        this.objEnvio.CardCode = something;
        this.objEnvio.DocDueDate = something;
            this.objEnvio.BPL_IDAssignedToInvoice = something;
            $('.table-servico .mat-row').each(function(index, element){
                     self.objEnvio.DocumentLines[index].ItemCode =something;   // this line is throwing the error

Expected output:

   {
       "CardCode": "C000009",
       "DocDueDate": "2019-04-25",
       "BPL_IDAssignedToInvoice": 1,
       "DocumentLines": [
          {
          "ItemCode": "IT0001",
          "UnitPrice": 207,
          "Quantity": 4,
          "TaxCode": "1101-001",
          },
          {
          "ItemCode": "SV0003",
          "UnitPrice": 110,
          "Quantity": 1,
          "TaxCode": "1933-001",
          },
         ]
     }

Current outcome:

TypeError: Cannot set property 'ItemCode' of undefined

Answer №1

Finally got it working, simply include an additional

   newObj:any = <any>{
            Items:<any>[
                 <any>{

               }
          ]
        };

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

Why does Rollup insist on treating my dependency's TypeScript code as if it were written in JavaScript?

I've included an example code snippet here: https://github.com/thejohnfreeman/bugs/commit/b4ff15a670691ada024589693d22f4fd0abae08d The module called parent is primarily composed of type declarations written in TypeScript. The source entrypoint for Ty ...

Learn how to send an SMS using Angular and Ionic 4 without having to open the native SMS app

I have been actively monitoring the GitHub repository for the Ionic Native SMS plugin at https://github.com/cordova-sms/cordova-sms-plugin. Following the suggested configuration from the repo, I have set it up as follows: var options = { repla ...

Arranging information within the Ngb-Accordion

Welcome to the code snippet showcasing how to create an accordion in Angular: <ngb-accordion [closeOthers]="false" activeIds="0"> <ng-container class="card" *ngFor="let post of Posts"> <ngb-panel title="{{post.title}} - ...

Node was experiencing difficulty locating a module alias that had been defined in the tsconfig file and package.json

I'm currently working on deploying a typescript project in production mode. You can find the code on Github here Executing npm run start:dev launches the server at http://localhost:3000/ Running npm run build generates the dist folder The definitio ...

Having issues with triggering click events using querySelector in Angular 2

Having trouble using querySelector with click() method in Angular it is causing a compilation error: 'click' is not recognized as a method on type 'Element' document.body.querySelector(".class").click(); ...

Customize the columns of your Angular Material 2 table by defining them using TemplateRef and ngTemplateOutlet

Looking to create a flexible material table with the ability to utilize TemplateRef along with ngTemplateOutlet for generating columns. Check out this demo where I have employed the cards component within my custom material-table component. Inside the card ...

Tips for retaining scroll position in Angular 2

Suppose I am currently on page 1. I scroll halfway through the page and then click a link that takes me to page 2 using the Angular router. When I use the "back" button, I want page 1 to be scrolled halfway down, just like it was before I left the page. H ...

Exploring Typescript for Efficient Data Fetching

My main objective is to develop an application that can retrieve relevant data from a mySQL database, parse it properly, and display it on the page. To achieve this, I am leveraging Typescript and React. Here is a breakdown of the issue with the code: I h ...

I'm looking for a sample of RadPieChart for nativescript + angular. Can anyone help me out?

I'm currently working on a multi-platform application that requires a PieChart to be displayed on the main screen. Can someone point me to a comprehensive example of how to implement this? I have tried following this guide and modifying it according ...

Optimizing Angular 2+ performance with a custom minification of the

I've taken note of the cautions regarding avoiding pipes for ordering/sorting. While I understand the concerns with impure pipes, I'm not entirely clear on the issue with minification. The documentation and various posts highlight the potential ...

The HttpClient.get('/') request with {observe: 'response'} is failing to retrieve some headers

Currently, I'm in the process of writing an API GET request by utilizing HttpClient.get(). Upon passing in the option to observe the response, I've encountered an issue where accessing the .keys() does not provide me with any headers apart from C ...

Guide on accessing mobile information and sim card details with Ionic 3 and Cordova on Android devices

Just started using Ionic and I'm looking for guidance on how to retrieve mobile and sim details with Ionic 3 and Cordova for Android. Any help is greatly appreciated in advance! ...

Discover the step-by-step process for moving data between collections in MongoDB

I am currently working on nestjs and have two collections, one for orders and the other for payments. My goal is to retrieve a single entry from the orders collection and save that same entry into the payments collection. Below is the code for the service ...

Passing objects to Angular 4 routes while maintaining Query Params unchanged

I'm currently working with Angular 4 and I need to pass an object to the router without updating query parameters. user.component.ts this.router.navigate(["/profile",{ action: 'edit', user: {id: 1, name: 'test', email: &apo ...

Using vue-router within a pinia store: a step-by-step guide

I'm currently setting up an authentication store using Firebase, and I want to direct users to the login/logged page based on their authentication status. My goal is similar to this implementation: https://github.com/dannyconnell/vue-composition-api- ...

Angular with RxJS: Observable with synchronous data flow

One of the services I have includes a method called foo. In this method, I am subscribing to an observable (http-client). foo () : boolean { let ret : false; this.http.get ("/blabla").subscribe ( (resp) => { ret = true; } return ret; ) ...

What possible reasons could cause the installation of Visual Studio 2017 to disrupt node.js or the typescript compiler?

Recently, I updated to the latest version of Visual Studio 2017 and selected the node.js support option during installation. However, after this update, I encountered issues with the typescript compiler (tsc) in an Angular 2 project that was last modified ...

The function type '() => JSX.Element' cannot be assigned to the type 'ReactNode'

I am encountering an issue while trying to display a component using an object. The code is throwing an error: const Login = () => <>login</> const publicRoutes = [ { path: '/login', component: Login } ] function AppR ...

What is the best way to kickstart a Reactive Angular 2 form by utilizing an Observable?

My current strategy involves storing the form values in my ngrx store so that users can easily navigate around the site and return to the form if needed. The concept is to have the form values repopulate from the store using an observable. This is how I a ...

Nestjs is throwing an UnhandledPromiseRejectionWarning due to a TypeError saying that the function this.flushLogs is not recognized

Looking to dive into the world of microservices using kafka and nestjs, but encountering an error message like the one below: [Nest] 61226 - 07/18/2021, 12:12:16 PM [NestFactory] Starting Nest application... [Nest] 61226 - 07/18/2021, 12:12:16 PM [ ...