ng-model 입력 유형 'number'는 angularjs가 작동하지 않습니다.
angular app에 requiresj를 통합했습니다.requirejs를 통합하기 전에
<input type="number" value="{{cart.quantity}}" ng-model="cart.quantity" />
입력란에 값을 표시하고 있었습니다.
그러나 requirejs와 통합한 후 type="number" 입력란에 값이 표시되지 않습니다.type="text" 입력 상자가 작동합니다.
type="number"로 값을 표시하는 방법은 무엇입니까?
감사해요.
나는 이 같은 문제에 부딪혀 겨우 해결했다.제 경우 RESTful을 통해 모델을 입수하고 있습니다.$resource
그리고 금액의 값이 필드에 문자열로 제공되어 값이 지워집니다.이 문제를 해결하기 위해 컨트롤러에서 다음 작업을 수행하게 되었습니다.
$scope.cart = Cart.get(id: $routeParams.id, function(cart){
cart.quantity = parseFloat(cart.quantity, 10);
});
보기를 업데이트하기 전에 값을 부동으로 변환합니다.내가 우연히 만난 한 가지는 내 첫 번째 시도가$scope.cart.quantity = parseFloat($scope.cart.quantity, 10)
직후에get
에의 비동기 콜시에 값이 덮어쓰기 되어 있기 때문에, 이것은 동작하지 않았습니다.get
완료된.
$scope.cart = Cart.get(id: $routeParams.id);
$scope.cart.quantity = parseFloat($scope.cart.quantity, 10); // This won't work
이게 도움이 됐으면 좋겠다.
바인딩된 값은string
단 한 명도 없다number
.
우선, 서버가 송신하고 있는 것을 확인합니다.number
PHP 를 사용하고 있는 경우는, 다음의 것을 사용할 수 있습니다.
json_encode($array, JSON_NUMERIC_CHECK);
또, 이 때릴 수도 있습니다string
안으로int
또는float
클라이언트 측에서 Javascript를 사용하는 경우:
var data = ['1.9', '3']; //these won't be binded to the numbers-only input
data[0] = parseFloat(data[0]); //this will
data[1] = parseInt(data[1]);
그것은 버그가 아니다.numbers
input은 유효한 숫자(유효)만 받아들입니다.
주의:
그리고 제가 묶으려고 했던 게ng-value
정수 필터가 있지만 작동하지 않습니다.아마 그 이유는...ng-model
둘 다 발견되었을 때 바인드되는 것입니다(예, 둘 다 같은 우선순위 수준입니다).
커스텀 디렉티브를 사용하여 이 문제를 해결합니다.
angular.module('directives').directive('input', function() {
return {
restrict: 'E',
require: 'ngModel',
link: function(scope, $el, attrs, ngModel) {
if ($el.get(0).type === 'number') {
ngModel.$parsers.push(function(value) {
return value.toString();
});
ngModel.$formatters.push(function(value) {
return parseFloat(value, 10);
});
}
}
}
})
이렇게 하면 데이터를 restfull 리소스를 통해 가져올 때 HTTP 응답을 변경할 필요가 없습니다.
필요에 따라서, 이 디렉티브를 제한합니다.
값은 ng-model에 의해 덮어씁니다.값 속성을 삭제하면 ng-model에 카트 수량이 입력됩니다.
동일한 문제(실제로 입력 유형="범위")가 발생했으며, 사용자 지정 지시어를 사용한 해결 방법은 다음과 같습니다.
app.directive('ngFloat', function() {
return {
restrict: 'A',
require: 'ngModel',
link: function(scope, $el, attrs, ngModel) {
ngModel.$parsers.push(function(value) {
return parseFloat(value, 10);
});
ngModel.$formatters.push(function(value) {
return value.toString();
});
}
};
});
명령어를 "ngFloat" 속성으로 제한했으므로 다음과 같이 입력에 태그를 붙여야 합니다.
<input ng-float type=.........
이것이 미래의 방문객들에게 도움이 되기를 바랍니다.
입력에 이름 속성을 추가했더니 작동하기 시작했습니다.
카트의 경우.수량 데이터 유형이 아닙니다.Number
,작동이 안될 거에요.
니즈:
$scope.cart.quantity = parseFloat($scope.cart.quantity);
이 케이스 카트의 ng-model.quantity는 문자열이 아닌 숫자여야 합니다.
이 링크를 찾았는데 도움이 되었어요.Ruy Diaz가 보여준 것과 같은 방법으로 숫자 입력에 부가할 수 있는 문자열 투 번호 디렉티브가 생성됩니다.https://docs.angularjs.org/error/ngModel/numfmt
저도 같은 문제에 부딪혀서 새로운 사람에게 복잡한 해결책을 찾으려고 하다가 https://docs.angularjs.org/api/ng/input/input%5Bnumber%5D의 angular 이전 버전에서 해결책을 발견했습니다.
ng-model이 어떤 문자열을 받아들이느냐에 따라 회피책으로 다음 명령어를 정의합니다.
분
그리고.
맥스.
입력 유형="숫자" 사용 중 값
나에게도 효과가 있었고 다른 사람에게도 효과가 있었으면 좋겠다.
이상하네, 내 경우엔 제거가min
★★★★★★★★★★★★★★★★★」max
「」의 어트리뷰트input type="number"
내 은...ng-model
★★★★★★★★★★★★★★★★★★!!
arpit Kumar가 위에 올린 글과는 완전히 반대인 것 같아.
AngularJS 버전: 1.6.1
angular
.module('xxx')
.directive('ngFloat', function () {
return {
restrict: 'A',
require: 'ngModel',
link: function (scope, $el, attrs, ngModel) {
ngModel.$formatters.push(function (value) {
return +value
});
}
};
});
언급URL : https://stackoverflow.com/questions/16829616/ng-model-for-input-type-number-not-working-angularjs
'programing' 카테고리의 다른 글
정의되지 않은 메서드 WP_Textdomain_Registry::reset() 호출 (0) | 2023.03.23 |
---|---|
MVC Json Result camel Case 시리얼화 (0) | 2023.03.23 |
Angular에서 $log.debug를 설정/해제하는 방법JS (0) | 2023.03.23 |
NodeJs 애플리케이션 및 모듈 전체에서 Mongodb에 대한 연결을 적절하게 재사용하는 방법 (0) | 2023.03.23 |
ASP에서 파일을 다운로드합니다.Angular를 사용하는 NET Web API 메서드JS (0) | 2023.03.23 |