Angular add class method as parameter

Question

I have a function from a library which is called like this:

example: setMode(CLR.Drop);

There are other options, Drop, Grab, None

So, I've created a method:

selectMode(mode) {
    setMode(mode);
}

On a button click I've tried this:

<button (click)="CLR.Drop">Set Mode</button>

When I do the above I get that CLR.Drop is undefined.

So, I've having to pass a number or string like this:

<button (click)="selectMode('drop')">Set Mode</button>

And this have to do this:

selectMode(mode) {
    if (mode === 'Drop') {
        mode = CLR.Drop;
    } else if (mode === 'Grab') {
        mode = CLR.Grab;
    } else if (mode === 'None') {
        mode = CLR.None;
    }
    setMode(mode);
}

Is there a way to do this without end with lots of if's or a switch or is this the only way?

put CLR in a property of component (e.g. CLR = CLR) then your original code will work — Aleksey L.
– Aleksey L., Commented Jun 18, 2020 at 10:58
HTML : <button (click)="selectMode('Drop')">Set Mode</button> TS : selectMode(mode) { if (mode == 'Drop') { mode = CLR.Drop; } else if (mode == 'Grab') { mode = CLR.Grab; } else if (mode == 'None') { mode = CLR.None; } setMode(mode); } — Mahmoudi MohamedAmine
– Mahmoudi MohamedAmine, Commented Jun 18, 2020 at 11:01

Barremian · Accepted Answer · 2020-06-18 11:07:12Z

1

You could assign the property CLR to a local variable and pass it to the handler.

export class AppComponent {
  public clr = CLR;

  onClick(mode: any) {
    setMode(mode);
  }
}

Template

<button (mouseup)="onClick(clr.Drop)">Drop mode</button>

Or in the switch-case variant, send 'Drop' instead of 'drop'. String literal comparisons are case sensitive.

<button (click)="selectMode('Drop')">Set Mode</button>

answered Jun 18, 2020 at 11:07

Barremian

31.2k4 gold badges37 silver badges67 bronze badges

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

1 Comment

Siraj Alam Over a year ago

IDK, but giving type any just ruins the taste of TS. :/

Siraj Alam · Accepted Answer · 2020-06-18 11:05:09Z

0

Give the type of the parameter as the name of the member of the class. And assign the function to some method named variable. And call the method/

class Calc {

  add() {
    console.log('I am add');
  }

  subtract() {
    console.log('I am subtract');
  }

}


function CalcCaller(fun: keyof Calc ) {
const method = (new Calc())[fun];
  method();
}

CalcCaller('add');

Playground Link

answered Jun 18, 2020 at 11:05

Siraj Alam

10.2k10 gold badges61 silver badges76 bronze badges

Collectives™ on Stack Overflow

Angular add class method as parameter

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related