Angular 添加 class 方法作为参数

Question

我有一个来自库的 function，它的名称如下：

example: setMode(CLR.Drop);

还有其他选项，Drop，Grab，None

所以，我创建了一个方法：

selectMode(mode) {
    setMode(mode);
}

在一个按钮点击我试过这个：

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

当我执行上述操作时，我发现 CLR.Drop 是未定义的。

所以，我必须像这样传递一个数字或字符串：

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

这必须这样做：

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

有没有办法通过大量的 if 或 switch 无止境地做到这一点，或者这是唯一的方法？

Answer 1

您可以将属性CLR分配给局部变量并将其传递给处理程序。

export class AppComponent {
  public clr = CLR;

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

模板

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

或者在 switch-case 变体中，发送'Drop'而不是'drop' 。 字符串文字比较区分大小写。

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

Answer 2

将参数的类型作为 class 的成员的名称。 并将 function 分配给某个名为变量的方法。 并调用方法/

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');

游乐场链接