Show variable outside callback function - Ionic2

When working with ionic2, I encountered a situation where I needed to pass a variable from an asynchronous method to my template and other methods within the component file. In the `ngOnInit` method of my controller, I have the following code:

ngOnInit()
{
   let a;
   this.myAsyncMethod(function(b))
   {
       a = String(b);  
   }
}

I attempted to assign the value of `a` to a variable `c` and encountered an error:

export class myComponent {
c:string;

constructor(....){ // some stuff }
... other methods 

ngOnInit()
{
   let a;
   this.myAsyncMethod(function(b))
   {
       a = String(b);
       this.c = a; // here I get this error in red: EXCEPTION: TypeError: Cannot set property 'c' of undefined  
   }
 }

}

In my `template.html`, I wanted to display the value of variable `c` using `{{c}}`. However, I struggled to make `c` visible both in the template file and all other methods within `mycomponent.ts`. How can I achieve this?

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

Vue watchers capturing original value prior to any updates

When working with Vue.js, we can easily access the value after modification within watchers using the following syntax: watch: function(valueAfterModification){ // ...... } But what about getting the value before it's modified? PS: The official ...

`Finding the nodejs API route for displaying images from a database`

How can I successfully display an image from the database without getting a string of question marks instead? Click here to see the issue >>> When attempting to directly call the API using the provided link, the following result is returned: {&qu ...

What steps should be taken to switch a class from one li element to another and remove it in the process?

As I develop the navigation bar for my website, I am faced with a challenge. I want to create a button-like behavior where clicking on an li element triggers a drop-down section underneath it without using the # attribute to prevent jumping to the top of t ...

What is the best way to perform type checking for a basic generic function without resorting to using a cumbersome cast

Struggling with TypeScript and trying to understand a specific issue for the past few days. Here is a simplified version: type StrKeyStrVal = { [key: string]: string }; function setKeyVal<T extends StrKeyStrVal>(obj: T, key: keyof T, value: str ...

typescript unconventional syntax for object types

As I was going through the TypeScript handbook, I stumbled upon this example: interface Shape { color: string; } interface Square extends Shape { sideLength: number; } var square = <Square>{}; square.color = "blue"; square.sideLength = 10; ...

Converting a Class Component to a Functional Component in React: A Step-by-Step

I need to refactor this class-based component into a functional component class Main extends Components{ constructor(){ super() this.state = { posts:[ { id:"0", description:"abc", imageLink: ...

When attempting to display an identical image on two distinct canvas elements in Angular 6

I am facing an issue where the image is only rendered on the second canvas instead of both canvases. I need assistance in finding a solution to render the same image on both canvases. Below is a screenshot demonstrating that the image is currently only re ...

What is the process of handling XML responses using node.js and express?

My task is to handle this using node.js and express: <set id="1" state="0" name="wd"/> I attempted the following approach: xml = require('xml'); res.set('Content-Type', 'text/xml'); res.send(xml('<set id="1" ...

The sequence of indices in a for loop and making Ajax requests

I'm dealing with a challenge related to executing ajax requests within a for loop. Despite researching solutions online and implementing them to prevent synchronous request execution, I still face an issue in maintaining the correct order of the succe ...

Preventing me from instantiating objects

I've been struggling with an issue for a while now consider the following: export abstract class abstractClass { abstract thing(): string } export class c1 extends abstractClass { thing(): string { return "hello" } } export cla ...

What could be causing the malfunction of my Superfish menu in Firefox?

I am currently experimenting with the Superfish jQuery plugin to improve a drop-down menu on my website. Unfortunately, in Firefox browser (v. 21.0), the drop-down menu does not open when hovering over it as expected. However, it works fine in Chrome and O ...

Exploring the World with the vue-i18n Plugin

Recently, I have integrated translation into my app and now I am looking to implement a button event that allows users to change the language on the home page. For this task, I referred to two tutorials: Localization with Vue and Localization with Vue Tut ...

How to initiate focus on Angular 2 MdInputContainer after the view has been

I am encountering an issue with setting focus on the first md-input-container element within a component when the view loads. Despite implementing a @ViewChild property and calling focus on it in the ngAfterViewInit method, the focus does not seem to be wo ...

What alternatives are there to angular scope functions?

I find angular scope functions challenging to work with due to their lack of a clear contract. They extract parameters from the scope and store results back into the scope, rather than explicitly defining function parameters and returning a result. Conside ...

The angularJS ternary expression is not considered valid

{{var.a != "N/A" ? "<a ng-href='myapp://find?name="+var.a+"'>"+'var.a'+"</a>" :var.a}} The ternary operator I have used in this Angularjs format does not seem to be working correctly. In the view, the ternary result is not ...

Enhance your WordPress website with Elementor and choose between React or Angular

I tried searching on Google, but I couldn't find any answers... Is it possible to create a custom Elementor widget in Wordpress using React or Angular? I want to build a component that will pull data from an API and dynamically render the page. I&apo ...

Retrieving information from the resolver component in Angular

After filtering data retrieved from the backend, I am struggling to pass the final data from the resolver to the component. While I can successfully filter the data and store it in an array within the resolver, I cannot seem to return this array so that it ...

Combining round brackets and square brackets when initializing an array

In the snippet below, values are assigned with a mix of parentheses and square brackets without any errors. However, most other combinations (such as parentheses inside square brackets) do not work at all. var myItems = []; myItems[5] = ("A1", "B1", ["C1" ...

A guide to monitoring and managing errors in the react-admin dataProvider

Rollbar has been successfully integrated into my react-admin app to track uncaught errors. However, I've noticed that errors thrown by the dataProvider are not being sent to Rollbar. It seems like errors from the dataProvider are internally handled w ...

What is the process for accessing the data attributes of div elements and then transferring them to a cookie?

Although this question may have been answered before, I couldn't find a specific solution. Imagine I have the following div elements... <div class="listings-area"> <div itemtype="http://schema.org/Product" itemscope=""> <a class="lis ...