Angular2（データ駆動型）のフォームバリデータとしてプロパティを使用

Question

Angular2のデータ駆動型アプローチを使用して最大値を設定しようとしています。 私はfirebaseから取得するuserLimitというプロパティに入力の最大値を設定します。これは私のコードです：

component.ts

import { Component, OnInit, AfterViewInit } from '@angular/core'; 
import { FormBuilder, FormGroup, Validators, FormControl } from "@angular/forms"; 
import { FiredbService } from '../services/firedb.service'; 
import { AuthService } from '../services/auth.service'; 
import { AngularFireDatabase, FirebaseListObservable, FirebaseObjectObservable } from 'angularfire2/database'; 

@Component({ 
    selector: 'my-dashboard', 
    styleUrls: ['./recibirpago.component.scss'], 
    templateUrl: './recibirpago.component.html' 
}) 
export class RecibirpagoComponent implements OnInit, AfterViewInit { 

    myForm2: FormGroup; 
    uid: string; 
    userLimit: any; 

    constructor(private fb: FormBuilder, 
       private dbfr: FiredbService, 
       private db: AngularFireDatabase, 
       private authService: AuthService) { 

    this.myForm2 = this.fb.group({ 
     email: ['', Validators.email], 
     clpmount: ['', [Validators.required, Validators.max(this.userLimit)]] 
     }); 

    } 

ngOnInit() { 
    this.uid = this.authService.getUserUid(); 
} 

ngAfterViewInit() { 
    this.dbfr.getUserLimit(this.uid).subscribe(snapshot => {   
    this.userLimit = snapshot.val().accountLimit; 
    console.log(this.userLimit); 
    }) 
} 

私が書く場合、例えば、（5000）、それは動作しますが、私はFirebaseからデータを取得しようとするならば、それは動作しませんValidators.max 。

ありがとうございました！

Answer 1

問題は、コンストラクタがより前に ngAfterViewInitを実行しているため、その時点でuserLimitの値がないことです。

代わりに、データを取得したサブスクライブでsetVAlidatorsメソッドを使用してください。このような

何か：

コンストラクタ

this.myForm2 = this.fb.group({ 
    email: ['', Validators.email], 
    clpmount: ['', Validators.required] // <-- not here 
    }); 

ngAfterViewInit

ngAfterViewInit() { 
    this.dbfr.getUserLimit(this.uid).subscribe(snapshot => {   
    this.userLimit = snapshot.val().accountLimit; 
    console.log(this.userLimit); 
    const clpControl = this.myForm2.get(`clpmount'); 
    clpControl.setValidators(Validators.max(this.userLimit)); // <-- HERE 
    clpControl.updateValueAndValidity(); 
    }) 
} 

注：構文がチェックされていませんでした。