Angular 动态窗体的动态函数

我正在从JSON对象模型生成反应式表单（与此类似，但要复杂得多）

简单的例子：

{

"id": "1"

"type":"input"

},

{

"id": "2"

"type":"dropDown"

}

表单的生成工作正常。现在我想实现控件之间的依赖关系

示例1：用户删除输入中的数据。应禁用以下所有控件 示例2：用户在下拉列表中选择一个值。下一个下拉列表应该使用所选的值，以该值作为参数执行rest服务，并显示接收到的数据。 ... （我至少有6个不同的案例）

问题是我在开发期间没有组件，因为表单是在运行时从JSON对象模型生成的

我的基本想法是在JSON对象模型中定义一个自定义函数，该函数将在特定事件发生时执行：

{
"id": "1"
"type":"input"
"dependencies": {
  "click": "clickFunctionForComponent1(1, 2)"
   }  
},
{
"id": "2"
"type":"dropDown"
}

“某处”我实现了这个功能

clickFunctionForComponent1(currentControl otherControl) {
  if (currentCuontrol has valid data) otherControl.data = loadDataForOtherControl(); 
}

---

您是否有任何（其他）想法可以实现此目的？

您可以使用eval调用此方法。 我试过这个

    function  clickFunctionForComponent1() {
      console.log('worked');
    }

    let data = JSON.parse(`{
      "id": "1",
      "type": "input",
      "dependencies": {
        "click": "clickFunctionForComponent1()"
      }
    }`);

console.log(eval(data.dependencies.click));

或

你可以试试这个

export class TimerComponent implements OnInit {
  constructor() {
   }


  ngOnInit() {

    let data = JSON.parse(`{
      "id": "1",
      "type": "input",
      "dependencies": {
        "click": "clickFunctionForComponent1"
      }
    }`);
      console.log(data);
      let methodName = data.dependencies.click;
      console.log(this[methodName]());
      // console.log(eval(data.dependencies.click));
  }
clickFunctionForComponent1() {
  console.log('work');
}

}

---

我也考虑过，但是角度版本$scope。$eval，但我正在尝试找到更好的方法。或者您可以在类范围中定义方法，并像下面这样调用它

let methodName=data.dependencies.click；log（这个[methodName]（））其中data.dependentials.click是方法名称（clickFunctionForComponent1）您指的是哪个类范围？我只有一个适用于所有表单的动态论坛生成器组件。我在谈论组件范围。没有任何方法作用域。因此，您可以使用[methodName]访问它，这是您写的第一条注释“或者您可以在类范围中定义方法”，您的确切意思是什么？正如我所说，我只有一个类/组件：dynamic-form-builder.component.ts用于所有表单。您是否建议在此类中为所有表单定义所有方法（硬编码），然后使用[methodName]（在JSON文件中定义）分配它们？