私はangular 2で初めてです。「ユーザー登録」フォームを作成していますが、電話番号の検証で「タイプにプロパティが存在しません」というエラーが表示されます。
私はJITとAOTでコンパイルしています。
JIT コンパイラでエラー メッセージが表示され、ユーザー登録フォームを実行すると正常に動作しています。しかし、AOT でコンパイルすると、コンパイル エラーが表示されます。
angular 2フォーム検証の公式ドキュメントを読んでいます。リンクはAngular 2フォーム検証です
以下は私のHtmlフォームとコンパイラ出力です
HTML フォーム
<form class="ui large form" method="post" (ngSubmit)="onSubmit(registerForm.form.valid)" #registerForm="ngForm" novalidate>
<sm-loader [complete]="!formSubmited" class="inverted" text="Loading..."></sm-loader>
<div class="form-group">
<div class="col-md-12 img-bottom">
<div class="col-md-offset-4">
<img (click)="profileImage.click()" class="img img-responsive img-circle ui middle aligned tiny circular image profileImage"
[src]="profileImageSrc" />
<input class="form-control user-reg-img" (change)="fileChangeEvent($event)" type="file" accept="image/*" #profileImage [hidden]="true"
/>
</div>
<div class="col-md-12 image-padding">
<span class="user-reg-img-name" (click)="profileImage.click()">{{profileImageName}}</span>
</div>
</div>
</div>
<div class="form-group">
<label><strong>Signup with Email Address:</strong></label>
</div>
<div class="form-group">
<p class="success text-center">{{successMessage}}</p>
<p class="error text-center">{{errorMessage}}</p>
<div class="field">
<input type="text" name="name" placeholder="Name" [(ngModel)]="register.name" #name="ngModel" required class="form-control input-reg"
/>
<div [hidden]="name.valid || name.pristine" class="error text-left">
Name is required
</div>
</div>
</div>
<div class="form-group">
<div class="field">
<input class="form-control input-reg" type="email" name="email" placeholder="Email" [(ngModel)]="register.email" #email="ngModel"
required />
<div [hidden]="email.valid || email.pristine" class="error text-left">
Email is required
</div>
</div>
</div>
<div class="form-group">
<input type="text" id="mobile" class="form-control input-reg" required minlength="10" maxlength="10" name="mobile" [(ngModel)]="register.mobile"
placeholder="Phone Number" #mobile="ngModel" pattern="[0-9]+">
<div *ngIf="mobile.errors && (mobile.dirty || mobile.touched)">
<div class="error text-left" [hidden]="!mobile.errors.required">
Mobile Number is required
</div>
<div class="error text-left" [hidden]="!mobile.errors.minlength">
Mobile Number must be at least 10 characters long.
</div>
<div class="error text-left" [hidden]="!mobile.errors.maxlength">
Monile Number cannot be more than 10 characters long.
</div>
</div>
</div>
<div class="form-group">
<div class="field">
<input class="form-control input-reg" type="password" name="password" placeholder="Password" [(ngModel)]="register.password"
#password="ngModel" required />
<div [hidden]="password.valid || password.pristine" class="error text-left">
Password is required
</div>
</div>
</div>
<div class="form-group">
<input type="checkbox" name="isAgree" [(ngModel)]="register.isAgree" #isAgree="ngModel" required />
<label id="label-terms-cond">I Agree to Post Bucks <a href="#">Terms & Conditions</a></label>
<div [hidden]="!showTermsAgreeErrorMsg" class="error text-left">
Please agree the terms and conditions to continue
</div>
</div>
<div class="form-group">
<textarea rows="4" class="form-control font-small terms-cond-textarea" rows="7">You must follow any policies made available to you within the Services.</textarea>
</div>
<div class="form-group">
<button class="fluid yellow large ui button btn btn-block btn-warning reg-btn-submit" type="submit">Signup</button>
</div>
</form>
AOT 出力
前もって感謝します
ヴィクラム