2017-04-02 9 views
0

나는 그 값을 토글 할 수있는 체크 박스를 두는 템플리트 기반 양식이 있습니다.각도 재료로 값 전환 CheckBox

구성 요소

public toggles = [ 
    { value: 'toggled', display: 'Toggled' }, 
    { value: 'untoggled', display: 'UnToggled' }, 
]; 

<div> 
    <input type="hidden" name="toggle" [(ngModel)]="user.toggle"> 
    <div> 
     <label> 
      <input type="checkbox" 
       [checked]="user.toggle === toggles[0].value" 
       (change)="$event.target.checked? (user.toggle = toggles[0].value) : (user.toggle = toggles[1].value)"> 
      {{ toggles[0].display }} 
     </label> 
    </div> 
</div> 

다음 작품이 좋은,하지만 난 각도 재료로 전환하고 때 그냥 작품에 실패합니다.

코드가

<input type="hidden" name="toggle" [(ngModel)]="user.toggle"> 
<md-checkbox [checked]="user.toggle === toggles[0].value" 
       (change)="$event.target.checked?(user.toggle = toggles[0].value): (user.toggle = toggles[1].value)"> 
    {{toggles[0].display}}</md-checkbox> 

내가 그것을 말한다 정의되지 않은 콘솔의 특성을 읽을 수 없습니다 콘솔에서 다음과 같은 오류를 얻고있다가,

TypeError: Cannot read property 'checked' of undefined 
     at Object.eval [as handleEvent] (TemplateDrivenComponent.html:64) 

내가 오류가 발생하는 점을 알고 소재 템플릿 $ event.target.checked angular가 md-checkbox에서이 체크 된 이벤트를 읽을 수 없으므로이 포인터를 해결하는 방법은 훌륭합니다.

감사합니다

+0

글쎄, $ event.target의 값은 무엇입니까? – TheRealMrCrowley

+0

$ event.target의 값은 확인란이 선택되어 있는지 확인하지 않고 코드의 checkbox 속성에서옵니다. –

+0

무엇인지 알고 있지만 그 값은 – TheRealMrCrowley

답변

1

의견을 보면 다음과 같은 희망을 시도해보십시오. 문제가 해결되면 재료로 이벤트를 사용할 필요가 없습니다.

<input type="hidden" name="toggle" [(ngModel)]="user.toggle"> 
     <md-checkbox [checked]="user.toggle === toggles[0].value" 
         (change)="$event.checked?(user.toggle = toggles[0].value): (user.toggle = toggles[1].value)"> 
      {{toggles[0].display}}</md-checkbox> 
+0

감사합니다. –