Converting an anonymous function to a named function in JavaScript

In my Angular application, I have the following template:

<dxi-column dataField="ordre"
              caption="Ordre"
              [width]="70"
              dataType="number"
              [allowEditing]="true">
     <dxi-validation-rule type="async"
              [validationCallback]="myFunction"
              message="">
     </dxi-validation-rule>
</dxi-column>

The myFunction function is defined as:

myFunction=(params) => {
    console.log(this.myClassVariable)
    return Of(!this.myClassVariable.includes(params.value)).toPromise()
  }

I want to change the way "myFunction" is declared to:

myFunction() { 
  //SAME TREATMENT
}

I also attempted to update the function like this:

myFunction() { 
    console.log(this.myClassVariable)  // THROW UNDEFINED
    return Of(!this.myClassVariable.includes(params.value)).toPromise()    
}

However, I encountered an issue with the class variable being undefined.

Any suggestions on how to solve this?

Answer №1

Remember to make sure to bind this.myFunction within the constructor of your component.

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

The caching mechanism in IE 11 is preventing Ajax from loading and displaying data

Utilizing Ajax to verify data and display it on the page, alongside implementing varnish cache. The data appears correctly on all web browsers, with the exception of IE 11, unless the varnish cache is disabled. function checkMyData() { var surl = 'in ...

The state array is rejecting the value from the other array, resulting in null data being returned

I am currently attempting to extract image URLs from an HTML file input in order to send them to the backend and upload them to Cloudinary. However, I am facing an issue where despite having the imagesArr populated with images, setting the images state is ...

Show Data from API on Angular 6 Webpage

Hello everyone, I am a beginner in the world of frontend development and I'm currently facing a challenge with displaying API data in an Angular 6 application. I have managed to showcase values from the main level of the returned details, but I am str ...

The act of exporting components from the main index file allows for

I have assigned a components folder where I created various components that I want to export to the index.js file and then export all of them from there. This is an example from one of the components files: export default ToggleSwitch; Now, in the inde ...

Difficulty with Ajax post function in CodeIgniter

I am currently working with CodeIgniter version 3.1. When attempting to use Ajax post, I encountered a 403 (Forbidden) error in the console. [POST http://localhost/test/post 403 (Forbidden)] HTML <div class="post"> <input type ...

Angular requiring me to configure polyfills due to the updates in Webpack 5

While working on my code, I executed ng serve and encountered an error related to polyfills: BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and confi ...

What could be causing Jquery to alter data while making an ajax Post request?

My situation involves an object that has the following structure: var data = { "to" : "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="83f0eceee6ecede6c3e2e1e0ade0ecee">[email protected]</a>", "attachment" : [ ...

Using AngularJS to inject a service into a static property of a standard class

For my current project, I am combining TypeScript and AngularJS. One of the challenges I'm facing is how to instantiate a static member of a public class (not controller, just a normal class) with a service object. When it comes to controllers, utiliz ...

Modifying the content of JSON key values

In my application, I am using MongoDB, Express, and MongoDB. When receiving data on the server side, it comes in the form of an array of objects (JSON) named upProbations. For example, let's say I find information about Max: [ { Name ...

Ways to rotate SVG images exclusively upon clicking

After experimenting with rotating SVG images on my navbar buttons, I encountered an issue. Whenever I click one button, all the images rotate simultaneously. Additionally, clicking elsewhere does not reset the images to their original positions. This is t ...

Unique 512-character string generated with Node.js

Is it possible to create a string of 512 characters in length that is truly unique? Can the nodejs built-in crypto module be used for this purpose to minimize collisions? Do you think the following sample code can achieve this goal? crypto.randomBytes(51 ...

This code snippet, document.location.search.replace('?redirect=', '').replace('%2F', ''), is failing to execute properly in Firefox

The functionality of document location search replace redirect to another page works in Chrome, however, document.location.search.replace('?redirect=', '').replace('%2F', ''); it does not work in Firefox; instead, ...

The Design and Layout of a MEAN Stack Application

When creating a MEAN Stack app using the express-generator npm, everything worked perfectly but I found myself confused about the purpose of certain files. For instance: The package.json included this code snippet: "script":{"start": "node ./bin/www"} ...

Show the information stored in an array using Angular

I have recently transitioned from using React to learning Angular, and now I am facing the challenge of displaying data from an array. My goal is to implement a dropdown menu where users can select an ID and see the corresponding address displayed. I bel ...

Is it advisable to avoid circular imports in typescript development?

After spending 4 long hours troubleshooting a TypeScript error, I finally found the root cause. Object literal may only specify known properties, and 'details' does not exist in type 'Readonly<{ [x: `details.${string}.value`]: { value: st ...

Troubleshooting: Why is Jquery unable to retrieve image height?

Having trouble using jQuery to find the actual height of the first image nested within a container. I can access the src attribute but not the height. Any suggestions on how to get the accurate height? Is it necessary to retrieve heights via CSS? Unfortu ...

Arranging the button next to the text input field in an Angular application

I added a button labeled "X" to a page, but it is currently positioned below a textfield. How can I use Bootstrap to align the button next to the textfield instead? https://i.sstatic.net/kbX5S.png <div class="form-group row"> <div class ...

Error in JScript encountered during the downgrade to .NET Framework 2.0

Working on a Web Application project has brought about some challenges for me. Originally created in .NET 3.5, I recently found out that it has to be converted to .NET 2.0 (sigh). This transition not only caused issues with the LINQ functionalities but als ...

Troubleshooting the lack of success in enhancing global scope within Typescript

Currently, I am working on a microservices application where I have two very similar services that use practically the same packages. To perform some testing, I decided to add a function to the global scope and modified it slightly to prevent any TypeScrip ...

Navigating to two separate webpages concurrently in separate frames

I am working on creating a website with frames, where I want to set up a link that opens different pages in two separate frames. Essentially, when you click the link, one page (such as the home page in a .html file) will open in frame 1 on the left side, ...