angular - 如何在 Angular 2 中使用具有类数据类型的 ngModel？

Question

我想在 Angular 2 项目中使用类实例进行两种方式的数据绑定。可能吗？我缩短了代码以便于理解

    ---- typescript ----

export class PackageOption {
    name: string;
    description: string;
...
}
import  { PackageOption }  from "./packageoption";
class PackageComponent extends Component implements OnInit {
    ...
    packageOptCurrent: PackageOption;
    ngOnInit() {
        this.packageOptCurrent = new PackageOption();
    }
...
}
    ---- templete ----
       <form [formGroup]="packageOptAddForm" #f="ngForm">
                <input type="text" formControlName="name" name="name" [(ngModel)] = "packageOptCurrent.name">
       </form>

我试过了，但我得到了这个错误

ngModel 不能用于使用父 formGroup 指令注册表单控件。尝试改用 formGroup 的合作伙伴指令“formControlName”。例子：

    <div [formGroup]="myGroup">
      <input formControlName="firstName">
    </div>

    In your class:

this.myGroup = new FormGroup({
   firstName: new FormControl()
});

或者，如果您想避免注册此表单控件，请在 ngModelOptions 中指明它是独立的：

  Example:


<div [formGroup]="myGroup">
   <input formControlName="firstName">
   <input [(ngModel)]="showMoreControls" [ngModelOptions]="{standalone: true}">
</div>

谢谢

Answer 1

这应该是可能的，但是您必须使用组件装饰器在类的上下文中声明实例。例如

//import typescript person class

@component({
    //some configuration
})
export class SomeClassComponent {
   mPerson = new Person();
}