사용자 정의 검사기 - 매개 변수 전달

Question

양식의 categories 필드에 값이 있는지 확인하는이 사용자 정의 유효성 검사기가 있는데, 그렇다면 mealTypes 필드가 null 인 경우 mealTypes을 유효하지 않게 설정합니다. 그것은 내 구성 요소의 외부에 배치되어

function validateMealType(findForm: AbstractControl): { [key: string]: boolean]} { 
    if (findForm.get("mealCategoryChosen").value) { 
     if (!findForm.get("mealTypes").value) { 
      return { "invalidMealTypes": true }; 
     } 
    } 
    return null; 
} 

그리고 난 내 구성 요소 양식을 검증하기 위해 내 구성 요소에서 사용 :

ngOnInit() { 
    this.findForm = this.formBuilder.group({ 
     categories: null, 
     mealTypes: [null, Validators.required], 
     mealCategoryChosen: null, 
     distanceNumber: null, 
     distanceUnit: 'kilometers', 
     keywords: null, 
    }, validateMealType); 
} 

을 그리고 그것은 작동합니다. Here is the plunker. plunker에 대한 나의 마지막 질문에 대한 답변자에게 많은 감사를드립니다.

지금은 하나만 허용 기준을 추가했습니다.

나는 구성 요소에이 부울 속성이 있습니다 :

private mealSelected: boolean = false;

내가 categories가 값을 가지고 있으며, mealtypes가 null의 경우는 무효로 mealTypes을 설정 순간.

categories에 값이 있고 mealTypes이 null이고 mealSelected === true 인 경우에만 mealTypes를 유효로 설정해야합니다. validateMealType 함수에 부울 매개 변수를 추가하고 내 구성 요소 속성을 전달할 수 있습니까? mealSelected ?? 내가 어떻게 그럴 수 있니? 누군가가 my plunker을 업데이트 할 수 있습니까? 필자는 사용자 정의 유효성 검사기에 매개 변수를 추가하여 코드를 완전히 이해하고 올바르게 적용하는 방법에 대한 답변을 찾고 있습니다.

Answer 1

당신은 표현하기 위해 새로운 FormControl을 만들 수 현재 mealSelected

this.findForm = new FormGroup({ 
    mealTypes : new FormControl(null, Validators.Required), 
    categories : new FormControl(null), 
    mealSelected : new FormControl(false) // <-- here is the new form control 
}, validateMealType); 

당신은 어떤 html input 새 FormControl을 연결하지 않아도, 당신은 값을 프로그래밍

this.findForm.controls["mealSelected"].setValue(true) //programatically set the value 

를 업데이트 할 수 카테고리에 값이 있고 mealTypes가 null이고 mealSelected === true 인 경우에만 mealTypes를 유효로 설정해야합니다. 여기

는 사용자 정의 유효성 검사기가 Plunker