2014-03-30 3 views
0

프레임 워크를 이해하기 위해 angular.js를 튜토리얼로 사용하여 세금 계산 용 앱을 만들려고합니다. 내가 눈치 우선 사용자 입력은 기본적 분명히 대신에 수치 연산의 sum 함수 문자열 연결을 만드는 문자열로 가정하는 것입니다 것입니다 여기를 참조 :Angular JS를 통해 사용자 입력시 모델 값을 업데이트하는 방법은 무엇입니까?

var taxApp = angular.module('taxApp', []); 

taxApp.controller('taxController', function($scope) { 

    $scope.user_data = { 
     income_1: 0.00, 
     income_2: 0.00 
    }; 

    $scope.total = function() { 
     return $scope.user_data.income_1 + $scope.user_data.income_2; 
    }; 


}); 

http://jsfiddle.net/96beZ/3/

내가 각각에서는 parseFloat를 추가 할 수 있습니다 속성하지만 내 애플 리케이션은 결국 약 10-20 사용자 입력 필드와 5-10 계산 사이에있을 것입니다. 나는 컨트롤러 코드의 모든 곳에서 parseFLoat를 여러번 반복하는 것을 피하고자한다.

... 
$scope.parseFLoat = function(model) { 
    $scope.user_data[model] = parseFloat($scope.user_data[model]); 
}; 
... 

http://jsfiddle.net/96beZ/5/

그래도 마음에 들지 않는 것은 아직도 변수 이름을 전달할 필요가있다 그래서이 너무 모델 이름은 : 지금까지, 나는 단지 그 사용 NG 변화 같은 것을 가지고 매달린.

지시문을 사용하여 내가 원하는 것을 달성하는 더 좋은 방법이 있습니까? 아니면 Angular는 값 유형을 변경하기 위해 내장 함수를 가지고 있습니까?

답변

1

<label for="income-1">Income 1</label> 
<input type="number" id="income-1" ng-model="user_data.income_1" /> 
<label for="income-2">Income 2</label> 
<input type="number" id="income-2" ng-model="user_data.income_2" /> 

에 입력 유형을 변경

하고 자동으로 숫자로 변환됩니다.

좀 더 복잡한 상황 (예 : 어떤 이유로 입력 유형이 텍스트이어야 함)에서는 변환을 처리하기 위해 지시문을 쉽게 작성할 수 있습니다. Input model changes from Integer to String when changed

+0

감사합니다. 이 필드 유형을 완전히 잊어 버렸습니다. HTML5의 새로운 요소를 사용하는 것을 여전히 꺼리고 있습니다. 지시어가있는 코드는 내가 찾고있는 코드이며, 확실히 일부 형식 변환을 위해 사용할 것입니다. – irwin

관련 문제