2017-03-31 1 views
0

나는이 같은 코드 아우렐 리아에서 라디오 버튼 세트를 만드는 오전 : 이런 식으로 일을, 그러나아우렐 리아 리피터 : model.bind 라디오 버튼 작동하지 않습니다

<div repeat.for="option of options"> 
     <input type="radio" id="${option}_id" name="radio_options" model.bind="option" checked.bind="optionValue"/> 
     <label for="${option}_id" id="${option}_label">${option}</label> 
    </div> 

그 model.bind 발견 작동하지 않습니다. 라디오 버튼을 선택하면 해당 클래스의 optionValue가 채워지지 않습니다. 마찬가지로 클래스의 optionValue에 값이 할당되면 해당 라디오 버튼이 선택되지 않습니다. 나는 리피터에서만 일어나는 것을 발견했다. 내 경우에는 옵션이 숫자입니다. 여기에 무슨 문제가 있는지 알아 보도록 도와주세요.

+2

당신은 일을 실행 . 모델이 객체입니까, 아니면 문자열입니까? 그냥'value.bind = "option"'이 아니어야합니까? –

+0

제 경우에는 "옵션"은 제가 말했듯이 숫자입니다 (나는 aurelia 클래스에서 this.options = 9를가집니다). 나는 value.bind = "option"을 시도했지만 도움이되지 않았다. – sleb82

답변

1

첫 번째 문제는 객체로 작업 할 때 model.bind을 사용해야한다는 것입니다. 기본 유형으로 작업 중이므로 대신 value.bind을 사용해야합니다.

두 번째 문제는 입력 값이 항상 문자열이므로 초기 값을 설정할 때 문자열이어야한다는 것입니다.

HTML : :

<template> 
    <div repeat.for="option of options"> 
    <input type="radio" id="${option}_id" name="radio_options" value.bind="option" checked.bind="optionValue"/> 
    <label for="${option}_id" id="${option}_label">${option}</label> 
    </div> 
    <p>Selected Option: ${optionValue} </p> 
</template> 

JS : 예를 들어 당신이 정말보기 모델의 INT를 사용하려면

export class App { 
    options = [ 1, 2, 3, 4 ] 
    optionValue = '3'; 
} 

, 당신은 값을 변환하는 ValueConverter를 만들 수 있습니다 뷰로 /으로부터 뷰를 건네 줄 때의 int 예를 들어 :

export class AsIntValueConverter { 
    fromView(value) { 
    return Number.parseInt(value); 
    } 

    toView(value) { 
    return value.toString(); 
    } 
} 

사용법 :`ID = "$ {옵션} _id"`과`model.bind = "옵션을"`:

<input type="radio" id="${option}_id" name="radio_options" value.bind="option" checked.bind="optionValue | asInt"/> 

https://gist.run/?id=1465151dd5d1afdb7fc7556e17baec35

+0

감사합니다, Fabio Luz. ValueConverter의 조언이 도움이되었습니다. – sleb82

+0

이것이 문제를 해결하면 정답으로 표시하십시오. –

관련 문제