私は非常にシンプルなインターフェースを持っています：
（models.ts）
export interface User{
Id : number;
FirstName : string;
LastName : string;
Email: string;
PhoneNumber: string;
}
そして非常に単純な形式：
（app.component.html）
<fieldset class='form-group' >
<h2>Create New User</h2>
<label>First Name: <input type="text" [(ngModel)]='FirstName'></label><br>
<label>Last Name: <input type="text" [(ngModel)]='LastName'></label><br>
<label>Phone number: <input type="phone"[(ngModel)]='PhoneNumber'></label><br>
<label>Email Address: <input type="email" [(ngModel)]='Email'></label><br>
<button (click)="createNewUser()">Create User</button>
</fieldset>
ここで、データを単純な文字列に2方向にバインドし、これらの文字列に基づいてオブジェクトを作成します。これは機能しますが、少し面倒に感じます。空のオブジェクトを新しくして、次のようにオブジェクトに直接割り当てることができるかどうか疑問に思いました。
（app.component.ts）
userToCreate: User;
（app.component.html）
<label>First Name: <input type="text" [(ngModel)]='userToCreate.FirstName'></label><br>
これを行おうとすると、TypeScriptはそれを示すエラーをスローします
未定義のプロパティ 'FirstName'を読み取ることができません
私は何を間違っているのですか、それともこれは不可能ですか？
問題があるということuserToCreateですundefinedので、あなたが結合されているプロパティのどれを持っていません。
コンポーネントの個々のプロパティにバインドしてから、createNewUser関数でユーザーオブジェクトをアセンブルする必要があります。またはuserToCreate、少なくとも空のオブジェクトで初期化する必要があります。
userToCreate: User = {} as User;
型アサーション（キャストとも呼ばれます）が必要なの{}は、Userインターフェイスが必要とするプロパティを実際には定義していないためです（これらはいずれもオプションではないため）。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加