첫 번째 선택 옵션이 각도 4로 선택되지 않은 경우 두 번째 선택 옵션 비활성화

Question

첫 번째 선택 옵션을 선택하지 않은 경우 두 번째 선택 옵션과 입력 값을 비활성화하려면 어떻게합니까? 내 경우, 첫 번째 선택 옵션은 "Select Ingredient"입니다. 구독하고 결과가 성공하면 두 번째 선택 옵션과 입력 값을 사용하도록 설정 한 "재료 선택"이벤트가 있습니다. 여기 내가 만든 stackblitz 코드. 당신은 topping_id 제어를 처음들을 해제 할 수 있습니다

https://stackblitz.com/edit/angular-rgxfsa?file=app/app.component.ts

onSelectIngredient(event): void { 
    const ingredient_id = this.productForm.get('ingredient_id').value 
    // this.subscription = this.ingredientService.selectIngredient(ingredient_id) 
    // .subscribe(
    //  (data:any) => { 
    //   this.ingredient = data;  
    //  }, 
    //  error => { 
    //  console.log(error); 
    //  }) 
    } 

Answer 1

처음에 다음과 같은 코드에 의해 두 번째 양식을 사용하지 :

this.productForm.controls["topping_id"].enable(); 

그것이 도움이 될 것입니다 희망 :

this.productForm.controls["topping_id"].disable(); 

첫 번째 드롭 다운 코드에 따라 제어를 가능하게 한 후 변경됩니다

.

Answer 2

후 관찰 가능한 통제의 valueChange에 가입하여 선택을 ingredient_if을들을 수 있습니다.

ingredient_id 값을 선택한 경우 수동으로 토핑 제어를 사용하도록 설정할 수 있습니다.

Here is a forked stackblitz