The value is currently unset in the TypeScript language

The variable `this.engenes_comparte` is showing up as undefined inside the subscribe function, but it works fine outside of it.

 baja(){    
  this._restService.getEngines(this._globalService.currentFisherMan.nid).subscribe((data : any[]) => {
    let state = 0;
        for (let index = 0; index <= data.length; index++) {
          for (let l = 0; l <= this.engines_compare.length; l++) {
            if(data[index].nid != this.engines_compare[l].nid){

            }
          }
        }
        console.log(this.engines_compare);
  });

  this.sube();
}

Answer №1

I'm having trouble grasping the specifics of your program, but I believe the issue lies in the difference between function(){ this } and () => {this}

The use of this in an arrow function has a different meaning compared to using this in a normal function(){}.

let A = {
   f() {
      return this.a // 'this' refers to the caller of f, which may not always be A
   },
   f2: () => {
      return this.a // 'this' always equals A in this case
   },
   a: 1
}
A.f() // => 1 because the caller of f is A, so 'this' refers to A.
A.f.call({}) // => undefined because the caller of f is not A, but {}
A.f2() // => 1 
A.f2().call({}) // => 1 because 'this' always refers to A

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

Issue with Discord.js (14.1) - Message Handling Unresponsive

After developing a sizable Discord Bot in Python, I decided to expand my skills and start learning JS. Despite thoroughly studying the documentation and comparing with my original Python Bot regarding intents, I am facing difficulties getting the message ...

Adding Currency Symbol to Tooltip Data in Material-UI Sparklinechart

Below is a SparklineChart example using MUI library: import * as React from 'react'; import Stack from '@mui/material/Stack'; import Box from '@mui/material/Box'; import { SparkLineChart } from '@mui/x-charts/SparkLineCha ...

Iterating through elements to set the width of a container

I am currently working on a function that dynamically adjusts the width of an element using JavaScript. Here is my JavaScript code: <script> $('.progress-fill span').each(function(){ var percent = $(this).html(); if(per ...

Having Trouble Retrieving Environment Variables in Next.js API Endpoints

Currently, I am in the process of working on a project utilizing Next.js 13 and API routes to communicate with a database. My goal is to securely store my database credentials in a .env file, but unfortunately, the variables are not loading as expected. I ...

How can I execute a synchronous MongoDB query in Node.js properly?

When utilizing the Node.JS driver for MongoDB, I am interested in executing a synchronous query. Here is an example of what I am aiming to achieve: function retrieveSomething() { var database = new mongo.Db("mydatabase", server, {}); database.ope ...

Storing a JSON response in a variable

I need assistance with using the Google Geocoder API to obtain the longitude and latitude of an address for a mapping application. How can I retrieve data from a geocode request, like this example: "http://maps.googleapis.com/maps/api/geocode/json?address ...

What is the best way to combine two bytes in Java?

I have a variable named writePos which holds an integer value between 0 and 1023. My goal is to store this integer in the last two bytes of a byte array called bucket. To achieve this, I need to express it as a combination of the array's final two byt ...

Learn how to default export React with withRouter, all while taking advantage of Material UI's makeStyles

I have been working on integrating Material UI makeStyles with class components, passing useStyles as props while default exporting it in an arrow function. export default () => { const classes = useStyles(); return ( <LoginClass classes={cl ...

Steps to create a thumbnail image following the insertion of an image into an input type="file" within a form, and subsequently submitting both elements on the form together

Currently, I am working on a form that enables users to upload images. Once the user submits the form, my goal is to create thumbnails for each image on the front-end and save them on the server afterwards. Due to security restrictions, changing the value ...

When using Angular2, the form is being mistakenly submitted instead of triggering the desired onSubmit() method

I am working on a component that includes the following elements: Template <div class="hide" id="login-contents"> <form *ngIf="!current_user" role="form" (ngSubmit)="onSubmit()" #loginForm="ngForm"> <div class="form-group"> ...

Utilizing Javascript to load a vast amount of data onto the browser, followed by initiating an XML

Looking for a solution to send XML requests containing values and content from files obtained by filling out an HTML form. With 5 large files, some exceeding 70 MB, I have implemented JavaScript functions to load file contents and assemble the XML request. ...

JavaScript date selector allowing the selection of multiple dates

As a beginner in JavaScript, I am struggling to create a datepicker input field that allows multiple selections. Despite researching for solutions, none seem to fit my specific case. Can anyone offer guidance on how to achieve this? Your help is greatly ap ...

Ensuring a consistently positioned footer at the bottom

I understand that this might not seem like a significant issue, but I'm encountering some difficulties. In my main.html file, there are three divs. The first div contains the navigation bar, the second div is an "empty" div that uses JQuery/Javascript ...

What is AngularJS global data binding?

My template has a dynamic title that is inserted using the following code: <title>{{title}}</title> For each of my pages/routes, I use a different controller where I define the title like this: BackyApp.controller('HomeController', ...

Learn the steps to refresh a component in Angular 5

src/shared.service.ts public _testData:any;   set testData(value:any) {     this._testData = value   }   get testData():any {     return this._testData;   } src/header.component.ts private postValues( ...

Investigating SCSS Issues: The Problem with Absolute Imports

I am working on a project with the following structure: - my/project - assets - images - image-name.svg - source - components - MyComponent - MyComponent.module.scss - ... - ... ...

Incorporate a class into the fixed navigation menu using fullpage.js

I am attempting to modify the behavior of a sticky menu as the user scrolls down using fullpage.js. My goal is to have the #top-wrapper behave normally when the first section/page loads, and then add a class of is-fixed as you scroll down. When scrolling ...

Do you only need to utilize Provider once?

When using the redux module in react-native, it is common practice to utilize createStore from 'redux'. I am curious, is it sufficient to use <Provider/> just once to make the Redux store accessible throughout our app? import ReactDOM from ...

Using a JSON key as a parameter in a function

Would it be achievable to specify the key of an object as a function parameter? For instance, if I were to develop a filter function that could sort multiple map markers by marker.element.country or marker.element.population? This approach would allow me ...

having trouble parsing JSON data

Recently, I decided to experiment with JSON and utilized json_encode to generate a JSON object structured as shown below: [{ "timestamp": "12\/16\/2013 0:00", "curr_property": "7211", "curr_property_cost": "123", "day_pro ...