2016-10-03 4 views
0

값이 100 인 'bool'이라는 이름의 바운드 데이터 변수가 있습니다. 확인란을 클릭하면 50을 추가하여 값을 증가시키고 싶습니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?각도, 체크 박스로 모델 값 변경

<div ng-app="app"> 
    <h3 ng-model="bool = 100">BOOL</h3> 
    <input type="checkbox" ng-model="add = 50"/> 
    <div>{{bool + add}}</div> 
</div> 

어떤 도움도 대단히 감사하겠습니다,

감사합니다 :)

+0

는이 응용 프로그램에 대한 컨트롤러가 없으십니까? Javascript 코드 (컨트롤러)를 보여줄 수 있습니까? – ishmaelMakitla

+0

비어있는 컨트롤러가 있는데, 이것이 순전히 지시문 계산을 통해 가능했는지 궁금 해서요, 어디에도 갈 필요가 없습니다. –

+0

컨트롤러를 사용해 보시기 바랍니다. – ishmaelMakitla

답변

1

ng-model 표현식이 될 수 없습니다. 기본값을 지정해야하는 경우 ng-init을 사용해야합니다.

또한 체크 박스의 값은 true (1) 또는 false (0)입니다. 따라서 {{bool + add}}은 처음에 150을 표시하지만 체크 박스를 선택하거나 선택 취소하면 즉시 add이 선택 상태에 따라 0 또는 1이므로 100 또는 101 중 하나를 표시합니다.

angular.module('app', []);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
 
    <div ng-app="app"> 
 
     <h3 ng-model="bool" ng-init="bool = 100; additional = 0">BOOL</h3> 
 
     <input type="checkbox" ng-model="add" ng-change="additional = add * 50"/> 
 
     <div>{{bool + additional}}</div> 
 
    </div>

+0

안녕하세요 @ 렉스, 네. 그것은 값을 150으로 초기화 한 다음 체크 박스를 클릭하면 101 (true 값 1)을 설정하고 토글 스위치는 100과 101 사이를 전환합니다. –

+0

초기 값은 100이고 체크 박스를 클릭하면됩니다. 값이 150으로 바뀝니다 –

+0

HTML에서이 작업을 수행하려는 이유가 확실하지 않지만 한 가지 가능한 접근 방식을 보여주기 위해 내 대답을 업데이트했습니다. ishmaelMakitla가 제안한 것처럼,이 논리 유형은 실제로 컨트롤러에 속합니다. – Lex