2017-10-26 3 views
0

새 양식을 작성하거나 기존 양식을로드하고 편집하는 데 사용되는 서식 파일이있는 양식이 있습니다. 라디오 버튼 필드 세트에 데이터 바인딩을 적용하여 데이터베이스에서 오는 데이터에 따라 토글되도록했습니다. 그렇게 할 때, 다른 div의 가시성을 토글하는 데 사용되는 * ngIf가 더 이상 어떤 이유로 작동하지 않습니다.* ng 데이터 바인딩 적용 후 더 이상 작동하지 않는 div 표시 및 숨기기

전에 (가시성 전환 작품) :

<div class="col-xs-12 col-sm-12"> 
    <fieldset> 
     <input type="radio" formControlName="specificPilot" value="1" [ngClass]="{'td-radio-error': displayMessage.specificPilot}" (check)="radioSetValidator(changeForm.get('generalQuestionsFG.specificPilot'),[changeForm.get('generalQuestionsFG.pilotTransits')])">Yes 
     <input type="radio" formControlName="specificPilot" value="0" [ngClass]="{'td-radio-error': displayMessage.specificPilot}" (check)="radioSetValidator(changeForm.get('generalQuestionsFG.specificPilot'),[changeForm.get('generalQuestionsFG.pilotTransits')])">No 
     {{this.changeForm.get('generalQuestionsFG.specificPilot').value}} 
    </fieldset> 
</div> 
<div class="col-xs-12 col-sm-12"> 
    <textarea class="form-control" rows="2" formControlName="pilotTransits" style="width:100%" placeholder="Provide Transits for Pilot(s)" 
    *ngIf="changeForm.get('generalQuestionsFG.specificPilot').value==='1'"></textarea> 
</div> 

후 (데이터 작업을 결합하지만, 가시성 토글은하지 않습니다) :

<div class="col-xs-12 col-sm-12"> 
    <fieldset> 
      <input type="radio" formControlName="specificPilot" [value]="1" [ngClass]="{'td-radio-error': displayMessage.specificPilot}" (check)="radioSetValidator(changeForm.get('generalQuestionsFG.specificPilot'),[changeForm.get('generalQuestionsFG.pilotTransits')])">Yes 
      <input type="radio" formControlName="specificPilot" [value]="0" [ngClass]="{'td-radio-error': displayMessage.specificPilot}" (check)="radioSetValidator(changeForm.get('generalQuestionsFG.specificPilot'),[changeForm.get('generalQuestionsFG.pilotTransits')])">No 
      {{this.changeForm.get('generalQuestionsFG.specificPilot').value}} 
    </fieldset> 
</div> 
<div class="col-xs-12 col-sm-12"> 
    <textarea class="form-control" rows="2" formControlName="pilotTransits" style="width:100%" placeholder="Provide Transits for Pilot(s)" 
    *ngIf="changeForm.get('generalQuestionsFG.specificPilot').value==='1'"> </textarea> 
</div> 

누군가가 * ngIf가 확인 이유를 설명 할 수 있을까 라디오 버튼 컨트롤의 값이 더 이상 작동하지 않습니까? 값이 제대로 바뀌고 있는지 확인하기 위해 stubcode를 추가했습니다.

+1

b/c를 읽기가 어렵습니다. 수평 스크롤과 관련없는 정보가 많이 있습니다. 불필요한 정보를 삭제하십시오. 문제가있는'* ngIf' 라인은 무엇입니까? – BeetleJuice

+0

죄송합니다. 형식을 고정했습니다. 두 예제의 두 번째 마지막 줄에는 * ngIf가 표시됩니다. 첫 번째 예제는 두 번째 예제의 세 번째와 네 번째 줄에 표시된 것처럼 두 라디오 버튼의 value 속성에 데이터 바인딩을 추가하기 전에 작동했습니다. – David

답변

3

<input value="1">을 입력하면 값은 "1"입니다.

<input [value]="1">을 입력하면 숫자는 1이됩니다.

당신은 엄격한 평등과 비교되므로 깨집니다.

+0

이것은 그 것이고 나는 바보입니다. 정말 고맙습니다. – David