반응형
AngularJS는 컨트롤러에서 형식이 유효한지 확인합니다.
컨트롤러에서 양식이 유효한지 확인해야 합니다.
표시:
<form novalidate=""
name="createBusinessForm"
ng-submit="setBusinessInformation()"
class="css-form">
<!-- fields -->
</form>
내 컨트롤러:
.controller(
'BusinessCtrl',
function ($scope, $http, $location, Business, BusinessService,
UserService, Photo)
{
if ($scope.createBusinessForm.$valid) {
$scope.informationStatus = true;
}
...
다음 오류가 나타납니다.
TypeError: Cannot read property '$valid' of undefined
이거 드셔보세요
표시:
<form name="formName" ng-submit="submitForm(formName)">
<!-- fields -->
</form>
컨트롤러 내:
$scope.submitForm = function(form){
if(form.$valid) {
// Code here if valid
}
};
또는
표시:
<form name="formName" ng-submit="submitForm(formName.$valid)">
<!-- fields -->
</form>
컨트롤러 내:
$scope.submitForm = function(formValid){
if(formValid) {
// Code here if valid
}
};
컨트롤러를 다음과 같이 업데이트했습니다.
.controller('BusinessCtrl',
function ($scope, $http, $location, Business, BusinessService, UserService, Photo) {
$scope.$watch('createBusinessForm.$valid', function(newVal) {
//$scope.valid = newVal;
$scope.informationStatus = true;
});
...
여기 또 다른 해결책이 있습니다.
html에 숨겨진 범위 변수를 설정하면 컨트롤러에서 사용할 수 있습니다.
<span style="display:none" >{{ formValid = myForm.$valid}}</span>
다음으로 완전한 작업 예를 제시하겠습니다.
angular.module('App', [])
.controller('myController', function($scope) {
$scope.userType = 'guest';
$scope.formValid = false;
console.info('Ctrl init, no form.');
$scope.$watch('myForm', function() {
console.info('myForm watch');
console.log($scope.formValid);
});
$scope.isFormValid = function() {
//test the new scope variable
console.log('form valid?: ', $scope.formValid);
};
});
<!doctype html>
<html ng-app="App">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js"></script>
</head>
<body>
<form name="myForm" ng-controller="myController">
userType: <input name="input" ng-model="userType" required>
<span class="error" ng-show="myForm.input.$error.required">Required!</span><br>
<tt>userType = {{userType}}</tt><br>
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br>
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br>
<tt>myForm.$valid = {{myForm.$valid}}</tt><br>
<tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br>
/*-- Hidden Variable formValid to use in your controller --*/
<span style="display:none" >{{ formValid = myForm.$valid}}</span>
<br/>
<button ng-click="isFormValid()">Check Valid</button>
</form>
</body>
</html>
그BusinessCtrl
초기화가 완료됩니다.createBusinessForm
의FormController
만약 당신이 이 모든 것을 가지고 있다 해도ngController
원하는 대로 되지 않을 거야어쩔 수 없습니다(고객님이 직접 작성하실 수 있습니다).ngControllerDirective
priority를 속여 보겠습니다).이렇게 angularjs가 동작합니다.
다음 plnkr를 참조해 주세요.
언급URL : https://stackoverflow.com/questions/20054055/angularjs-check-if-form-is-valid-in-controller
반응형
'programing' 카테고리의 다른 글
패키지에 "홈 페이지"를 사용합니다.json, localhost 패스를 망치지 않고 (0) | 2023.03.18 |
---|---|
스프링 부트 화이트 라벨 삭제 오류 페이지 (0) | 2023.03.18 |
React 컴포넌트에 CSS와 스타일링을 적용하는 방법 (0) | 2023.03.18 |
파일 이름이 대/소문자가 같은 상대 경로에서 이미 포함된 파일 이름과 다릅니다. (0) | 2023.03.18 |
맥락.Context에 의해 전달된 값에 액세스하기 위한 Consumer vs useContext().프로바이더 (0) | 2023.03.18 |