2016-03-23 20 views
0

私は角度2でフォームの検証を実行しようとしています。今は特定の店の在庫に製品を追加する製品フォームを追加しています。私は、製品の価格が製品の卸売価格以上であることを検証したいので、卸売価格をdata-*属性として追加しました。私が理解できないことは、Angular 2のNgControlでその属性を参照する方法です。ここに私のコードは次のとおりです。データダッシュ属性の角度2フォームフィールドの検証

... 
<div class="four wide field"> 
    <label>Wholesale Price</label> 
    <div class="ui left icon input"> 
    <input type="text" disabled [(ngModel)]="wholesalePrice" ngControl="wholesale" /> 
    <i class="dollar icon"></i> 
    </div> 
</div> 

<div class="four wide field"> 
    <label>Price</label> 
    <div class="ui left icon input"> 
    <input type="text" [(ngModel)]="retailPrice" [attr.data-wholesale]="wholesalePrice" ngControl="price" required /> 
    <i class="dollar icon"></i> 
    </div> 
</div> 
... 

... 
constructor(private fb: FormBuilder) { 

    this.form = fb.group({ 
     price: ['price', Validators.compose([ 
      Validators.required, 
      this.validator_moreThanWholesale 
     ])], 
     quantity: ['quantity'] 
    }); 

} 
... 
+0

なぜあなたはそれを属性にしますか? '@Input()wholeSale'を作成してコードからアクセスするのはどうでしょうか?値は 'ngAfterViewInit()'の 'constructor(){...}'でまだ利用できません。 –

答えて

1

私は、フォームのグローバルバリデータを作成します。

this.form = fb.group({ 
    price: ['price', Validators.compose([ 
    Validators.required 
    ])], 
    quantity: ['quantity'] 
}, { 
    validator: this.validator_moreThanWholesale 
})); 

あなたがチェックすることができるようになりますので、validator_moreThanWholesale方法は、入力として、すべてのコントロールを持っています:

validator_moreThanWholesale(group: ControlGroup) { 
    var wholesale = group.controls.wholesale.value; 
    var price = group.controls.price.value; 

    return (price < wholesale) ? { moreThanWholesale: true } : null 
} 

詳細については、この質問を参照してください。