2017-09-08 3 views
-1

각도 2 프로젝트에서 양방향 데이터 바인딩을 위해 클래스 인스턴스를 사용하고 싶습니다. 그것은 가능한가? 나는 시도하지만이 오류 각도 2에 ngModel을 클래스 데이터 유형으로 사용하는 방법은 무엇입니까?

ngModel는 부모 formGroup 지시어로 폼 컨트롤을 등록하는 데 사용할 수 없습니다

있어
---- 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> 

쉽게 이해

에 대한 코드를 단축. 대신 양식 그룹의 파트너 지시문 "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> 

감사

+0

오류가 발생했습니다. 제 질문을 수정합니다. –

+0

문제를 재현하는 완전한 최소 예를 게시하십시오. 코드를 보지 않고 코드가 왜 잘못된지 설명 할 수 없습니다. –

+0

코드를 다시 확인 하시겠습니까? –

답변

0

이것은 당신이, 가능해야하지만 컴포넌트 데코레이터를 사용하여 클래스 컨텍스트 내에서 인스턴스를 선언한다. 예 :

//import typescript person class 

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