Javascript 如何以角度反应形式设置对象键值

我有一件像这样的东西

types: {
  2: {
     zoom: true,
     select: true
  },
  4: {
     zoom: true,
     select: true
  },
}

是否可以从角度形式创建此json对象

<div formGroupName="types">
    <input type="number" matInput placeholder="Type" [(ngModel)]="searchType" i18n-placeholder>

    <div [ngModelGroup]="searchType">
        <mat-slide-toggle [(ngModel)]="searchType.zoom" color="primary">Zoom</mat-slide-toggle>
        <mat-slide-toggle [(ngModel)]="searchType.select" color="primary">Klik</mat-slide-toggle>
    </div>
</div>

快速移动
克里克

---

遗憾的是，不可能更改json，但数字需要可以更改。表单是反应式驱动的，但我找不到方法，所以我尝试了模板驱动，但两种方法都不起作用。

使用Angular

反应式表单和
工厂
构建您想要的
json
对象。可以将
属性
动态添加到对象中。但是您的道具名称不能是您在示例中提到的一些数字；如果你想要一些东西，最好有一个对象数组

那么，试试这样的方法：

应用程序组件.ts

从'@angular/core'导入{Component，OnInit}；
从'@angular/forms'导入{FormGroup，FormBuilder，Validators}；
从“./type.factory.ts”导入{TypeFactory}；
从“./app type.model”导入{TypeModel}；
@组成部分({
选择器：“我的应用程序”，
templateUrl:“./app.component.html”，
样式URL:['./app.component.css']
})
导出类AppComponent实现OnInit{
typesForm:FormGroup；
类型：TypeModel[]=[]；
建造师(
私有formBuilder:formBuilder，
私人打字机厂：打字机厂，
){}
恩戈尼尼特（）{
this.typesForm=this.formBuilder.group({
id:[''，[需要验证程序]]，
缩放：['']，
选择：['']
});
}
regForm=（）=>{
让newType=this.typeFactory.createTypeDto（this.typesForm.getRawValues（））；
this.types=[…types，…newType]；
}
}

app.component.html


快速移动
克里克
登记

应用程序类型.model.ts

导出类类型模型{
id：编号；
缩放：布尔；
选择：布尔型；
}

app.factory.ts

import{TypeModel}from./app-type.model'；
出口级打字机厂{
createTypeDto(
表格：任何，
)：TypeModel{
常量模型=新类型模型（）；
model.id=form.id；
model.zoom=form.zoom；
model.select=form.select；
收益模型；
}
}
为什么不使用
formControlName
？这些数字是什么以及它们来自何处？你想要一个反应式表单，但你需要使用模板驱动表单所需的
ngModel
。你可以动态地向你的
对象添加
属性。但是你的道具名称不能像你在例子中提到的那样是
number
；如果你想要一些东西，最好有一个对象数组。看到我的答案了吗