What is the best way to access variables within a function from an external function in Typecript?

Question

What is the best way to access variables within a function from an external function in Typecript?

On my HTML page, I am invoking a method with parameters using the onchange event. Once I retrieve the value, I trigger function2 on the click of another button. I am looking to access the variable from function in function2 within the same class. My implementation is based on Angular 6 and TypeScript. Below is a snippet of my TypeScript file:

 
export class Component extends Lifecycle {
  cc1: string;
  constructor (){}
  Function (cc1, cc2)
  {
   this.cc1 = cc1;
   // return cc1;
   }

  Function2 (){
      console.log(cc1);
    }
  }

Could someone provide assistance on this matter?

angular function typescript angular6

Answer 1

Answer №1

Utilize the this keyword within a method to access properties or methods specific to the class.

export class customComponent extends Lifecycle {
    property1: string;
        constructor() {
        super();
    }
    method1(property1, property2) {
        this.property1 = property1;
        // return property1;
    }

    method2() {
        console.log(this.property1);
    }
}

Remember to invoke super when extending the class.

Answer 2

Utilize the this keyword within a method to access properties or methods specific to the class.

export class customComponent extends Lifecycle {
    property1: string;
        constructor() {
        super();
    }
    method1(property1, property2) {
        this.property1 = property1;
        // return property1;
    }

    method2() {
        console.log(this.property1);
    }
}

Remember to invoke super when extending the class.

Answer 3

Answer №2

When working with Function2, you will utilize this.cc1 as illustrated below (please note that I have modified the parameters passed to Function1 to avoid confusion with the class-level variable)

export class component extends Lifecycle {
  cc1: string;

  constructor () {
    super();
  }

  Function1 (_cc1, _cc2) {
    this.cc1 = _cc1;
  }

  Function2 () {
    console.log(this.cc1);
  }
}

Answer 4

When working with Function2, you will utilize this.cc1 as illustrated below (please note that I have modified the parameters passed to Function1 to avoid confusion with the class-level variable)

export class component extends Lifecycle {
  cc1: string;

  constructor () {
    super();
  }

  Function1 (_cc1, _cc2) {
    this.cc1 = _cc1;
  }

  Function2 () {
    console.log(this.cc1);
  }
}

Answer 5

Answer №3

Inside the second Function

SecondFunction (){
      console.log(this.cc1);
    }
  }

Answer 6

Inside the second Function

SecondFunction (){
      console.log(this.cc1);
    }
  }

What is the best way to access variables within a function from an external function in Typecript?

Answer №1

Answer №2

Answer №3

Similar questions

Is it possible to deactivate the click event on an Angular mat table row?

retrieving information and parsing from an API using Ionic and Angular version 4

Using TypeScript generics to constrain to either a number or a string

ElevationScroll expects the 'children' prop to be a single child component of type 'ReactElement<any, string>'

Using the Angular Slice Pipe to Show Line Breaks or Any Custom Delimiter

Retrieving the component's values when utilizing the `<ng-content>` directive

Experiencing difficulty in triggering a NextUI Modal by clicking on a NextUI Table Row

Resolve the error message "Class is not a constructor" which arises while utilizing namespaces in TypeScript with WebPack

Encountered an issue while trying to install npm for an existing Angular 4 project

Validation Form Controls

Material-UI Alert: The property `onKeyboardFocus` for event handling is unrecognized and will not be applied

What prevents me from employing my nestjs unique decorator within a constructor?

Angular8 with the [tinymce] library for customizing editor elements and configuring multiline options

Loading screen displayed while transitioning between routes within Angular

Mastering the Art of Sharing PrimgNg Selected Checkboxes with Child Component Dropdown

The Angular 2 UI is unable to successfully connect with the controller through the API call

bespoke feature for conducting raw queries within the Laravel environment

Error: Angular SSR does not recognize IDBIndex

Is it possible to override CSS classes in Ionic without using app.scss?

Exploring the narrowing capabilities of TypeScript within while loops