How do I call a function from a function in typescript?

Question

I have a function called getColor(params) which returns a string to be used for CSS.

I'm trying to call it from another function but instead of the color being returned, I'm being returned the literal function body which is being inserted into my CSS.

Calling Function

coldef = (processedJson) => {
    this.customColumns.push(
        {
            headerName: "Test Set Name", field: "field1", width: 310,
            cellStyle: { 'font-size': '12px;' }
        });

    this.customColumns.push(
        {
            headerName: "Test Case Name", field: "field2", width: 310,
            cellStyle: { 'font-size': '12px;' }
        });

    for (var i = 0; i < this.columns.length; i++) {
        var item = this.columns[i];
        this.customColumns.push(
            {
                headerName: this.columns[i], field: this.columns[i], width: 110,
                cellStyle: { 'font-size': '12px;', 'background-color': this.getColor }
            });
    }
}

My problem is the function is returning function body as text.

this.getColor accepts a parameter called params, but from my understanding this value is inserted by angular and contains my JSON object.

How can I get getColor to return just the string I need?

Simply add (arguments) to this.getColor. How do you normally call a function? — Daniel B
– Daniel B, Commented Jan 25, 2018 at 15:07
this.getColor is being called when this code runs, not when it's displayed — Ben Kolya Mansley
– Ben Kolya Mansley, Commented Jan 25, 2018 at 15:08
@BenKolyaMansley the problem is params is not in scope inside the function.. — Fueled By Coffee
– Fueled By Coffee, Commented Jan 25, 2018 at 15:09
Then you've got to find some way to put it into the function — Ben Kolya Mansley
– Ben Kolya Mansley, Commented Jan 25, 2018 at 15:11

user4676340 · Accepted Answer · 2018-01-25 15:09:11Z

1

You're using this :

'background-color': this.getColor

while your function awaits for a parameter (according to you). Doesn't that seems strange to you ?

To call a function, you need to write the parenthesis like so :

'background-color': this.getColor()

In your case, you should also give it params, this means put something into the parenthesis.

answered Jan 25, 2018 at 15:09

user4676340

Sign up to request clarification or add additional context in comments.

Comments

Miroslav Jonas · Accepted Answer · 2018-01-25 16:18:57Z

You need to provide params to the getColor function and then actually call it as others suggested. There are two ways how you can get params in the call:

Pass it as an argument to colddef function:

coldef = (processedJson, params) => {
  this.customColumns.push(
    {
        headerName: "Test Set Name", field: "field1", width: 310,
        cellStyle: { 'font-size': '12px;' }
    });

  this.customColumns.push(
    {
        headerName: "Test Case Name", field: "field2", width: 310,
        cellStyle: { 'font-size': '12px;' }
    });

  for (var i = 0; i < this.columns.length; i++) {
    var item = this.columns[i];
    this.customColumns.push(
        {
            headerName: this.columns[i], field: this.columns[i], width: 110,
            cellStyle: { 'font-size': '12px;', 'background-color': this.getColor(params) }
        });
  }
}

Add it to the param object/scope (this):

this.params = params;

coldef = (processedJson) => {
  this.customColumns.push(
    {
        headerName: "Test Set Name", field: "field1", width: 310,
        cellStyle: { 'font-size': '12px;' }
    });

  this.customColumns.push(
    {
        headerName: "Test Case Name", field: "field2", width: 310,
        cellStyle: { 'font-size': '12px;' }
    });

  for (var i = 0; i < this.columns.length; i++) {
    var item = this.columns[i];
    this.customColumns.push(
        {
            headerName: this.columns[i], field: this.columns[i], width: 110,
            cellStyle: { 'font-size': '12px;', 'background-color': this.getColor(this.params) }
        });
  }
}

Fueled By Coffee · Accepted Answer · 2018-01-25 19:46:55Z

My problem was that params in angular is only in scope inside of a closure. I needed to just pass it down to getColor

 for (var i = 0; i < this.columns.length; i++) {
     var item = this.columns[i];
     this.customColumns.push(
         {   headerName: this.columns[i], field: this.columns[i], width: 110,
             cellStyle: (params) => {
                return { 
                   'font-size': '12px;', 'background-color': this.getColor(params)
                }; 
             }
         }
     );
 }

Collectives™ on Stack Overflow

How do I call a function from a function in typescript?

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related